Maison > interface Web > js tutoriel > filtrage de contenu jquery

filtrage de contenu jquery

无忌哥哥
Libérer: 2018-06-29 11:25:53
original
1634 Les gens l'ont consulté

<body>
<h2>春晓</h2><span></span>
<p>春眠不觉晓,处处闻啼鸟。</p>
<p>夜来风雨声,花落知多少</p>
<p>我的女神:<img src="../images/gyy.jpg" width="150"></p>
<p>我想对圆圆:<input type="" name=""><button>提交</button></p>
</body>
Copier après la connexion
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
<script type="text/javascript">
Copier après la connexion

//1. Sélectionnez les éléments contenant le contenu textuel spécifié

$(&#39;p:contains(\&#39;春\&#39;)&#39;).addClass(&#39;bg-wheat&#39;)
$(&#39;p:contains("春")&#39;).addClass(&#39;bg-wheat&#39;)
$(&#39;p:contains("风")&#39;).addClass(&#39;bg-green&#39;)
Copier après la connexion

//2. Sélectionner les balises avec un contenu vide signifie qu'il n'y a pas de sous-balises, pas même de texte. . Le contenu ne peut pas avoir

$(&#39;:empty&#39;).text(&#39;作者:孟浩然&#39;)
Copier après la connexion

//3. Sélectionnez l'élément p avec la balise img (image) et ajoutez-y un arrière-plan

$(&#39;p:has("img")&#39;).addClass(&#39;bg-pink&#39;)
Copier après la connexion

//4. éléments commençant par p Pour le nœud de l'élément parent, ajoutez un fond vert

$(&#39;p:parent&#39;).addClass(&#39;bg-green&#39;)
Copier après la connexion

//5. Inversez pas le filtre, sélectionnez tous les éléments de la page qui ne sont pas vides, et changez la couleur de premier plan. au rouge

$(&#39;:not(:empty)&#39;).css(&#39;color&#39;,&#39;red&#39;)
Copier après la connexion
</script>
Copier après la connexion

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