코드:
결과보기 »
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>jQuery Filtering</title> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script> $(function() { $("#clockwiseBtn").on("click", function() { $("li").eq(1) // 선택한 <li>요소 중에서 두 번째 요소만을 선택함. .css({"border": "2px solid green"}); // 해당 요소의 CSS 스타일을 변경함. }); $("#counterBtn").on("click", function() { $("li").eq(-1) // 선택한 <li>요소 중에서 뒤에서부터 첫 번째 요소만을 선택함. .css({"border": "2px solid orange"}); // 해당 요소의 CSS 스타일을 변경함. }); }); </script> </head> <body> <h1>.eq() 메소드</h1> <ul> <li>첫 번째 아이템이에요!</li> <li>두 번째 아이템이에요!</li> <li>세 번째 아이템이에요!</li> <li>네 번째 아이템이에요!</li> </ul> <button id="clockwiseBtn">eq(1)</button> <button id="counterBtn">eq(-1)</button> </body> </html>
