jQuery选择器之内容筛选选择器

图片.png

注意事项：

1. :contains与:has都有查找的意思，但是contains查找包含“指定文本”的元素，has查找包含“指定元素”的元素
2. 如果:contains匹配的文本包含在元素的子元素中，同样认为是符合条件的。
3. :parent与:empty是相反的，两者所涉及的子元素，包括文本节点

示例1:

$(".mp:contains(':parent')").css("color", "red");
匹配class为mp的且文本内容含有:parent的元素并将内容颜色改为红色
注意匹配的文本内容一定要使用单引号，否则无法匹配(不知道是不是bug)

示例2:

$(".div:has(span)").css("color", "blue");
查找所有class='div'中DOM元素中包含"span"的元素节点并且设置颜色为红色

示例3:

$("a:parent").css("border", "3px solid blue");
匹配任意位置所有a标签中的所有元素，并增加一个蓝色的边框

$("a:empty").text("empty").css("border", "3px red");
匹配所有a元素下所有的空节点，并为其写入文本为empty，并增加一个红色的文本框