Maison >interface Web >js tutoriel >JQuery : contient (texte) le cas d'utilisation du sélecteur

JQuery : contient (texte) le cas d'utilisation du sélecteur

黄舟original: 2017-06-23 11:05:251827parcourir

Aperçu

Correspond aux éléments contenant le texte donné

Paramètres

texteChaîneV1.1.4

A à rechercherChaîne

Exemple

Description :

Trouver tous les éléments div contenant "John"

Code HTML :

<div>John Resig</div> <div>George Martin</div> <div>Malcom John Sinclair</div> <div>J. Ohn

Code jQuery :

$("div:contains(&#39;John&#39;)")

Résultat :

[ <div>John Resig</div>, <div>Malcom John Sinclair</div> ]

Exemple de code :

Exemple 1 :

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>脚本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("button").click(function(){ 
    $("li:contains(&#39;html&#39;)").css("color","blue") 
  }) 
}) 
</script>
</head>
<body>
<ul>
  <li>html专区</li>
  <li>div+css专区</li>
  <li>Jquery专区</li>
  <li>Javascript专区</li>
  <li>html5专区</li>
</ul>
<button>点击查看效果</button>
</body>
</html>

Le code ci-dessus peut définir la couleur du texte dans l'élément li contenant "html" sur la couleur bleue.

:contains(text) dans jQuery

<body>
    <div>
        我    </div><script>
    $(function(){
        $(&#39;:contains(你)&#39;).css(&#39;background&#39;,&#39;lime&#39;);
    });</script>    </body>

:contains selector sélectionne une chaîne qui contient le spécifié éléments de chaîne. (W3school)

Je souhaite sélectionner des éléments qui contiennent la chaîne "vous". Évidemment, il n'y a aucun élément qui remplit les conditions sur la page, mais la page devient également verte. Les deux suivants peuvent également rendre la page verte (test aveugle) $(':even').css('background','lime'); $(':odd').css('background','lime ') ; Puis-je demander pourquoi ? Merci.

1. Pourquoi la page :contains('you') devient-elle verte ?

Étant donné que votre balise de script est sur l'écran HTML, jquery effectuera une recherche sur tout l'écran lors de la recherche d'éléments. Recherchez ensuite le mot « vous » dans le script, qui est le code JavaScript que vous avez écrit. Le programme le traite pour le moment comme du texte :

 $(function(){
        $(&#39;:contains(你)&#39;).css(&#39;background&#39;,&#39;lime&#39;);
 });

Donc : contient (vous) devrait trouver trois éléments : html, body et ce script. Ajoutez un arrière-plan aux styles de ces trois éléments. Bien sûr, l'ajout d'un arrière-plan est inutile si le script ne le prend pas en charge.

2.$(':even').css('background','lime'); $(':odd').css('background','lime'); changement Devenir vert ?

$(':even') sélectionnera le html, $(':odd') sélectionnera le corps, et définir l'arrière-plan de ces deux éléments sera bien sûr utile.

Autre ajout : Concernant le premier point, si vous écrivez votre code js dans un fichier js puis l'introduisez via la balise script, il n'y aura pas un tel problème. Si le texte que vous recherchez apparaît dans le commentaire , il sera également ignoré.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Explication détaillée de l'utilisation de jquery :focus selectorArticle suivant：Explication détaillée de l'utilisation de jquery :focus selector

Articles Liés

Voir plus