728x90
eq()탐색 선택자는 선택한 요소 중 지정한 인덱스가 참조하는 요소만 선택하고
lt()선택자는 선택한 요소 중 지정한 인덱스보다 작은 인덱스를 참조하는 요소만 선택한다.
이와 반대로, gt()는 선택한 요소 중 지정한 인덱스보다 큰 인덱스를 참조하는 요소만 선택한다.
* 기본형
$("요소 선택"):eq(index)") 또는 $("요소 선택").eq(index) $("요소 선택"):lt(index)") $("요소 선택"):gt(index)") |
* 예제
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title> 탐색 선택자 </title> <script src="js/jquery.js"></script> <script> $(function(){ $("#menu li").eq(2) .css({"background-color":"#ff0"}); $("#menu li:lt(2)") .css({"background-color":"#0ff"}); $("#menu li:gt(2)") .css({"background-color":"#f0f"}); }); </script> </head> <body> <h1>탐색 선택자</h1> <ul id="menu"> <li>내용1</li> <li>내용2</li> <li>내용3</li> <li>내용4</li> <li>내용5</li> </ul> </body> </html> |
'내마음대로만들어보자 > JS' 카테고리의 다른 글
nth-child(숫자n) / nth-last-child(숫자) 선택자 (0) | 2021.08.18 |
---|---|
first-of-type / last-of-type 선택자 (0) | 2021.08.18 |
even/odd 선택자 (0) | 2021.08.18 |
first/last 선택자 (0) | 2021.08.18 |
제이쿼리 선택자 (0) | 2021.08.16 |