jQuery 선택자에 대한 자세한 설명(이전 ~ 형제자매)

jQuery의 prev ~ 형제 선택기는 prev 요소 뒤의 모든 형제 요소를 일치시키고 이를 jQuery 개체 로 캡슐화하여 반환하는 데 사용됩니다.

참고: 선택기 형제의 검색 범위는 "이전 요소" 뒤의 요소여야 하며 형제 요소여야 합니다(즉, "이전 요소"와 동일한 상위 요소를 가짐).

Grammar

// 这里的prev表示具体的选择器
// 这里的siblings表示具体的选择器
jQuery( "prev ~ siblings" )

~ 기호 양쪽의 공백은 생략 가능하지만 생략하지 않는 것이 좋습니다. 문자가 너무 가까워서 읽기에 영향을 미칠 수 있기 때문입니다.

Parameters

매개변수 설명

prev 유효한 선택자입니다.

siblings 유효한 선택자입니다.

반환 값

선택기 형제와 일치하고 "이전 요소" 뒤의 형제 요소에 있는 DOM 요소를 캡슐화하는 jQuery 개체를 반환합니다.

해당하는 일치 항목이 없으면 빈 jQuery 개체가 반환됩니다.

예제 및 설명

다음 HTML 코드를 예로 들어보세요.

<div id="n1">
    <p id="n2" class="test">
        <span id="n3" class="a">Hello</span>
        <span id="n4">Hello</span>
    </p>
    <p id="n5" class="detail">
        <span id="n6" class="b codeplayer">World
            <span id="n7" class="a">http://365mini.com</span>
            <span id="n8"></span>
            <span id="n9"></span>
        </span>
    </p>
</div>

이제 p 태그 다음에 피어 p 태그를 찾으려면 다음 jQuery 코드를 작성할 수 있습니다.

// 选择了id为n5的一个元素
$("p ~ p");

그런 다음 id가 있는 형제 p 태그 n8의 스팬 태그 뒤의 형제 스팬 태그에 대해 다음 jQuery 코드를 작성할 수 있습니다.

// 选择了id为n9的一个元素
// n7虽然也是n8的同辈元素，但不在n8之后，而是之前，因此匹配不到
$("#n8 ~ span");

스팬 태그 뒤의 형제 스팬 태그를 찾으려면 해당 jQuery 코드는 다음과 같습니다.

으아악

위 내용은 jQuery 선택자에 대한 자세한 설명(이전 ~ 형제자매)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!