search

Home >Web Front-end >JS Tutorial >jquery content filtering

jquery content filtering

无忌哥哥
无忌哥哥Original
2018-06-29 11:25:531650browse

<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>
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
<script type="text/javascript">

//1. Select elements containing specified text content 

$(&#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;)

//2. Select tags with empty content. Empty means that there are no sub-tags, not even text content. 

$(&#39;:empty&#39;).text(&#39;作者:孟浩然&#39;)

//3. Select the p element with the img tag (picture) and add a background to it 

$(&#39;p:has("img")&#39;).addClass(&#39;bg-pink&#39;)

//4. Select all nodes with p as the parent element and add a green background

$(&#39;p:parent&#39;).addClass(&#39;bg-green&#39;)

//5. Invert the filter not, select all elements on the page that are not empty, and change the foreground color to red

$(&#39;:not(:empty)&#39;).css(&#39;color&#39;,&#39;red&#39;)
</script>

The above is the detailed content of jquery content filtering. For more information, please follow other related articles on the PHP Chinese website!

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：About the form item verification method in the v-for loop when vue uses the Element componentNext article：About the form item verification method in the v-for loop when vue uses the Element component

Related articles

See more