jQuery 콘텐츠 필터 선택기

콘텐츠 필터 선택기

:contains(content)

에는 콘텐츠 선택기가 포함되어 있으며 노드 내부에 지정된 콘텐츠는 태그를 통해 포함되어야 합니다

$("div:contains(beijing ) ”)

<div>linken love beijing</div>

<div>jack love shanghai</div>

:empty

빈 요소 가져오기(아니요) 요소 내부의 것 /text(비어 있음) )노드 개체

$("div:empty")

<div>linken love beijing</div>

<div>jack love shanghai</div>

<div> ;/div & gt; & lt; div & gt; & lt;/div & gt;

: Has(선택기)

에는

$("div:has(#apple)")

<div>hello</div>< 내부에 지정된 요소의 선택기가 포함되어 있습니다. ;div><p></p></div>

:parent

찾고 있는 노드는 상위 요소 노드로 존재해야 합니다.

$("div:parent")<div>linken love beijing</div>

<div>jack love shanghai</div>

<div></div> ;

<!DOCTYPE html>
<html>
    <head>
        <title>php.cn</title>
        <meta charset="utf-8" />
        <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

        <script>
        function f1(){
            //① $(":contains(text)")
            $("div:contains(beijing)").css('background-color','red');

            //② $(":empty")
            $("div:empty").css('width','200px');
            $("div:empty").css('height','100px');
            $("div:empty").css('background-color','pink');

            //③ $(":has(selector)")
            console.log($("div:has(.orange)"));

            //④ $(":parent")
            console.log($("div:parent"));
        }
        </script>
    </head>
    <body>
        <h1>内容过滤选择器</h1>
        <div>i love beijing</div>
        <div>jack love shanghai</div>
        <div></div>
        <div><img /></div>
        <div>      </div>
        <div><p class="orange"></p></div>
        <div><span class="orange"></span></div>

        <input type="button" value="触发" onclick="f1()" />
    </body>
</html>

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <title>php.cn</title> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> function f1(){ //① $(":contains(text)") $("div:contains(beijing)").css('background-color','red'); //② $(":empty") $("div:empty").css('width','200px'); $("div:empty").css('height','100px'); $("div:empty").css('background-color','pink'); //③ $(":has(selector)") console.log($("div:has(.orange)")); //④ $(":parent") console.log($("div:parent")); } </script> </head> <body> <h1>内容过滤选择器</h1> <div>i love beijing</div> <div>jack love shanghai</div> <div></div> <div><img /></div> <div> </div> <div><p class="orange"></p></div> <div><span class="orange"></span></div> <input type="button" value="触发" onclick="f1()" /> </body> </html>

제출하다 코드 재설정

자동운전