jQuery 순회 children() 메소드

jQuery는 컬렉션 개체입니다. 컬렉션에서 첫 번째 수준 하위 요소를 빠르게 찾으려면 children() 메서드를 사용할 수 있습니다.

참고: .children(selector) 메서드는 일치하는 요소 집합에 있는 각 요소의 모든 하위 요소를 반환합니다(아버지-아들 관계로 이해될 수 있는 아들 세대만 해당)

노드 검색 관계 이해:

<div class="div">
" " t;

위 코드: $("div").children()인 경우 div와 ul이 있으므로 ul만 찾을 수 있다는 의미입니다. 부모-자식 관계이고, li와 div는 조상 관계이므로 찾을 수 없습니다.

children()에는 매개변수가 없습니다

DOM 트리에서 이러한 요소의 직접적인 하위 요소를 검색하고 일치하는 요소의 새 jQuery 객체를 구성할 수 있습니다.

참고: jQuery는 컬렉션 객체이므로 하위 항목을 전달하는 것은 Combine입니다. 각 요소의 첫 번째 수준 하위 요소

Children() 메서드를 사용하여 동일한 유형의 선택기 표현식

$("div")을 선택적으로 허용하는 것도 jQuery가 컬렉션 개체이기 때문일 수 있습니다. 컬렉션 개체를 필터링하여 대상 요소를 찾으면 선택기 표현식을 전달할 수 있습니다

아래 예를 작성해 보겠습니다.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>childred()</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <div>
        <ul>
            <li>php.cn</li>
            <li>php 中文网</li>
        </ul>

        <p>  php </p>
    </div>


    <script>
        $("div").children().css("color", "red");
    </script>
</body>
</html>

위 코드를 작성하면 $("div").children()으로 이동합니다. css("color", "red"); 그러면 div 아래의 하위 요소가 검색되므로 div의 요소가 빨간색으로 변합니다. 위의 코드를 사용하면 다음과 같습니다. p 태그에 있는 요소의 색상은 변경되지 않았습니다. children()에 매개변수가 있기 때문입니다. 첫 번째 요소가 첫 번째 요소이므로 div에서 첫 번째 하위 요소를 찾게 됩니다

<ul> 는 div의 첫 번째 요소이므로 li 태그의 요소가 변경됩니다. 로컬에서 코드를 작성하여 시도해 볼 수 있습니다

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>childred()</title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div> <ul> <li>php.cn</li> <li>php 中文网</li> </ul> <p> php </p> </div> <script> $("div").children().css("color", "red"); </script> </body> </html>

제출하다 코드 재설정

자동운전