1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <style> div { border: 1px solid #000; } </style> <script src="js/jquery.js"></script> </head> <body> <div> <span>0번째</span> <p>1번째</p> <h3>2번째</h3> </div> <div> <button>버튼</button> </div> <div> <button>버튼</button> </div> <div> <button>버튼</button> </div> <div> <button>버튼</button> </div> <script> // 같은 레벨에서 내가 몇번째 요소인지 찾을때는 index를 이용한다. // 부모요소를 기준으로 내가 몇번째 자식이냐?? console.log($("h3").index()); // 2 // 그런데 같은 레벨이 아니라 모든 button요소중 내가 몇번째 인지 찾을때에는?? $("button").click(function(event) { var i = $(this).index(); console.log(i); // 0번째 // good var j = $("button").index(this); // 존재하는 모든 버튼을 기준으로 index console.log(j); }); </script> </body> </html> |
반응형
'jQuery' 카테고리의 다른 글
| [jQuery] 필터 선택자 - :parent, :empty, :has, :contains (1) | 2016.10.27 |
|---|---|
| [jQuery, CSS] z-index position div 겹친 영역 이벤트 처리 (0) | 2016.07.25 |
| [jQuery] detach() - 노드를 떼었다. 붙였다. CTRL + X, CTRL + V (0) | 2016.03.09 |
| [jQuery] $.trim() - 문자열 앞 뒤 공백제거 (2) | 2016.03.09 |
| [jQuery] html5 data 속성 제어 - data() 메서드 활용 (0) | 2016.03.08 |
