jQuery w3schools 한글판 강좌42 - Chaining
jQuery w3schools 한글판 강좌42 - 연달아 실행(chaining)
jQuery로 , 액션/동작을 서로 연이어 실행시킬수 있습니다.
연달아실행시킴(chaining) 을 이용하면 여러 jQuery메소드를 (같은 요소에 대해) 한개의 명령어(statement)로 실행할 수 있습니다.
jQuery 메소드 체이닝(연이어 실행시키기:chaining)
지금까지 우리는 jquery 명령어를(statement) 한번에 한번씩(또는 차례로) 적어왔습니다.
그러나, 체이닝이라 불리는 기술이 있는데, 그것을 이용하면 같은 한개의 요소 또는 같은 여러개의 요소들에 대하여 교대로, 여러 jQuery명령어를 실행할수 있습니다.
팁:이 방식으로 브라우저는 같은 요소 또는 요소들을 여러번 찾을 필요가 없습니다.
동작(action)을 연이어 실행시키려면, 단순히 동작(action)을 이전 동작에 붙이기만 하면 됩니다.
다음 예는 css(), slideUp()그리고 slideDown()메소드를 체이닝합니다.
"p1"요소는 맨 처음 적색으로 바뀌고, 그 다음에 위로 슬라이드되며, 그리고 나서 아래로 슬라이드 됩니다:
Example
$("#p1").css("color", "red").slideUp(2000).slideDown(2000);
필요하다면, 더 많은 메소드 호출을 추가 할 수 있습니다.
팁: 체이닝할때는 코드 줄은 꽤 길수 있습니다.
그러나, jQuery는 문법에 매우 엄격하지 않기 때문에
여러분은 여러분이 원하는 형식으로 해도 됩니다, 다음줄에 적어도 되고, 들여써도 되고...편하신 대로 ㅎ
아래처럼 해도 됩니다:
Example
$("#p1").css("color", "red")
.slideUp(2000)
.slideDown(2000);
.slideUp(2000)
.slideDown(2000);
jQuery 여분의 불필요하게 많은 공백(whitespace)을 없애주고
해당 줄을 한개의 긴 줄의 코드처럼 실행합니다.
게시판 목록
개발자팁
개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.
질문은 QA에서 해주시기 바랍니다.
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 4556 | jQuery |
프로그래머7
|
8년 전 | 1691 | |
| 4555 | jQuery |
프로그래머7
|
8년 전 | 1609 | |
| 4554 | jQuery |
프로그래머7
|
8년 전 | 1662 | |
| 4553 | jQuery |
프로그래머7
|
8년 전 | 2041 | |
| 4552 | PHP | 8년 전 | 1880 | ||
| 4551 | PHP | 8년 전 | 1467 | ||
| 4550 | PHP | 8년 전 | 1708 | ||
| 4549 | jQuery |
프로그래머7
|
8년 전 | 2744 | |
| 4548 | jQuery |
프로그래머7
|
8년 전 | 1441 | |
| 4547 | jQuery |
프로그래머7
|
8년 전 | 1367 | |
| 4546 | jQuery |
프로그래머7
|
8년 전 | 1684 | |
| 4545 | jQuery |
프로그래머7
|
8년 전 | 1710 | |
| 4544 | jQuery |
프로그래머7
|
8년 전 | 1866 | |
| 4543 | jQuery |
프로그래머7
|
8년 전 | 1653 | |
| 4542 | jQuery |
프로그래머7
|
8년 전 | 1584 | |
| 4541 | jQuery |
프로그래머7
|
8년 전 | 1633 | |
| 4540 | jQuery |
프로그래머7
|
8년 전 | 1666 | |
| 4539 | jQuery |
프로그래머7
|
8년 전 | 1863 | |
| 4538 | jQuery |
프로그래머7
|
8년 전 | 1536 | |
| 4537 | jQuery |
프로그래머7
|
8년 전 | 1697 | |
| 4536 | jQuery |
프로그래머7
|
8년 전 | 1935 | |
| 4535 | jQuery |
프로그래머7
|
8년 전 | 1520 | |
| 4534 | jQuery |
프로그래머7
|
8년 전 | 1855 | |
| 4533 | jQuery |
프로그래머7
|
8년 전 | 2344 | |
| 4532 | jQuery |
프로그래머7
|
8년 전 | 1917 | |
| 4531 | PHP |
 terrorboy |
8년 전 | 3711 | |
| 4530 | jQuery |
프로그래머7
|
8년 전 | 1800 | |
| 4529 | jQuery |
프로그래머7
|
8년 전 | 1901 | |
| 4528 | jQuery |
프로그래머7
|
8년 전 | 1699 | |
| 4527 | jQuery |
terrorboy |
8년 전 | 2698 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기