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

黄舟
Libérer: 2017-06-23 11:05:25
original
1810 Les gens l'ont consulté

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
Copier après la connexion

Code jQuery :

$("div:contains(&#39;John&#39;)")
Copier après la connexion

Résultat :

[ <div>John Resig</div>, <div>Malcom John Sinclair</div> ]
Copier après la connexion

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>
Copier après la connexion

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>
Copier après la connexion

: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;);
 });
Copier après la connexion

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal