sélecteur de filtre de contenu jQuery

Sélecteur de filtre de contenu

: contient (contenu)

Contient un sélecteur de contenu, l'intérieur du nœud obtenu doit contenir le contenu spécifié via la balise

$("div:contains(beijing)")

<div> ;linken love beijing</div>

<div>jack love shanghai</div>

:vide

Obtenir un objet de nœud d'élément vide (aucun élément/texte à l'intérieur (vide))

$("div:empty")

<div> linken love beijing</div>

<div>jack love shanghai</div>

< ;div><img /></div>

<div>

:has(sélecteur)

Le sélecteur qui contient l'élément spécifié à l'intérieur de $("div:has(#apple)")<div>hello</div>
<div> <p></p></div>

: parent

recherche Le nœud doit exister en tant que nœud d'élément parent $("div:parent")
<div>linken love beijing</div>

<div>jack love shanghai</div>

<div>section suivante

nouveau fichier

<!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>

soumettre Réinitialiser le code

Opération automatique

Plein écran