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

2017-01-25  本文已影响0人  光光的杂货铺
图片.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,并增加一个红色的文本框

上一篇 下一篇

猜你喜欢

热点阅读