开发者学堂课程【jQuery 开发教程： jQuery_内容过滤】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/362/detail/4280
jQuery_内容过滤
1、:contains()Selector
- 描述∶选择所有包含指定文本的元素
- 语法:
jQuery( ":contains(text)" ) - 注意:text:用来查找的一个文本字符串。这是区分大小写的。匹配的文本可以直接出现在所选的元素中，或在该元素的任何后代中，或两者兼有。
- 举例：写入几个
写上人名：
<body> <div> John Resig</ div> <div>gggg Resig< / div> <div>Malcom John. sinclair</ div> <div>J.ohn</div> 引入 jQuery：<script src="jquery-2.2.1.min.js">< /script> </ body>
写入 js：
< /script> < /script>
选择所有包含 John 的<div>加入 css 样式强调它们并加入下划线：
<script> $( function () { $ ( "div:contains( ' John ' ) ").css("text-decoration" , "underline"); }） </script>
执行可以看到第一个和第三个被加上了下划线。
2、:empty Selector
- 描述∶选择所有没有子元素的元素(包括文本节点)。
- 语法:
jQuery( ":empty" ) - 举例：创建文件为 empty，首先引入 jQuery：
<script src="jquery-2.2.1.min.js">< /script>
写入 table 加入表头和没有内容的标签：
<table border="1"> <tr><td>TD#0</td><td>< /td></tr> <tr><td>TD#2</td><td></td></tr> <tr><td></td><td>TD #5</td></tr> < /table>
查找所有空元素添加背景颜色：
<script> $ ( function() i $("d:empty").text( "was empty").css("background-color" ,"red"); })
执行，此时只有空元素被添加上了背景颜色。
3、:has() Selector
- 描述︰选择元素其中至少包含指定选择器匹配的一个种元素
- 语法:
jQuery( ":has(selector)" ) - 举例：写入<div>写入<p>标签加入内容：
<div><p>hello in a paragraph</p></div> <div>hello again : (with no p)</div>
写入 css：
<style> .text{ border: 1px solid green; } < /style>
给所有含有<p>标签的元素段落标签的<div>添加 .text 类：
<script> $ ( function() { $( "div:has(p)" ).addclass ( "text" ); })
第一个 div 被加上边框，因为有一个 p 标签。
4、:parent Selector
- 描述∶选择所有含有子元素或者文本的父级元素
- 注意：
JOuery "：parent" )
它们涉及的子元素都包括文本节点。
