JQuery 연구 노트 선택기 Six_jquery

코드 복사 코드는 다음과 같습니다.

<머리>





🎜>재설정

< ;li>li1< ;/li>

• li2


• li4


• ;li5
  




🎜>ul1의 짝수 인덱스 하위 요소의 배경색 설정｜
ul1의 홀수 인덱스 하위 요소의 배경색 설정｜
ul1의 선두 하위 요소의 배경색 설정< ;/ a>｜
ul1 ｜
모든 ul




1.$에서 유일한 하위 요소의 배경색을 설정합니다. ("ParentSelector ChildTagName:nth-child(...)") 참고 - 다음 약어는 다음과 같습니다. nth-child
설명: 인덱스 필터링을 위해 ParentSelector에서 선택한 요소 집합의 하위 요소 집합을 가져옵니다. 예제에서 aNth1을 클릭하면 ID는 ul1 요소의 li 하위 요소가 짝수(짝수) 선택을 수행합니다($("#ul1 li:nth-child(even)")). 키워드 even은 친숙해야 합니다. 3장에서 언급했었습니다. 그래도 헷갈린다면 3장으로 가셔서 보시면 됩니다 ^^ 물론 여기서도odd를 써도 되지만 3장과는 조금 다릅니다. 3장에서는 인덱스가 0부터 시작하는데 여기서는 인덱스가 1부터 시작해야 합니다. 디자인이 별로 좋지 않은 느낌이에요--! 이 방법은 또한 예제의 aNth2 클릭 이벤트와 마찬가지로 매우 유연한 사용법을 가지고 있으며 $("#ul1 li:nth-child(2n 1)") 방법은 유사한 $("#ul1 li를 완료하는 데 사용됩니다. :nth- child(odd)") 함수, 2n 1은 설명할 필요가 없습니다. 중학교 수학에서 자주 사용되는 함수입니다. 정말 이해가 안가시면 댓글 남겨주세요--! 이 방법은 "2"와 같은 특정 인덱스를 따를 수도 있지만 여기서 인덱스는 1부터 시작한다는 점을 기억하세요! !
반환값: Array(Element);
2.:first-child
설명: 선택한 요소 컬렉션의 헤드 요소를 가져옵니다. 여기 글은 간단해서 이해가 되실 텐데요, 예시를 들어봐도 이해가 안 되시면 올려주세요 - -!
반환값: Array(Element);

3.:last-child
설명: 선택한 요소 컬렉션의 마지막 요소를 가져옵니다.
반환 값: Array(Element);
4.:only-child
설명: 형제 노드 없이 요소를 가져옵니다. 예를 들어, 예제에서 두 번째 ul 요소에는 li 하위 요소가 하나만 있습니다. $( "ul li:only-child") 메소드는 li7만 얻습니다.
반환값: Array(Element);