jQuery的内容过滤选择器学习教程

内容过滤器的过滤规则主要是包含的子元素或文本内容上。

$(div:contains(“xxx”)).css(background, #ccc); //选择元素文本节点含有xxx 文本的元素

$(div:empty).css(background, #ccc); //选择空元素

$(ul:has(.red)).css(background, #ccc); //选择子元素含有class 是red 的元素

$(:parent).css(background, #ccc); //选择非空元素

jQuery 提供了一个has()方法来提高:has 过滤器的性能：

$(ul).has(.red).css(background, #ccc); //选择子元素含有class 是red 的元素

jQuery 提供了一个名称和:parent 相似的方法，但这个方法并不是选取含有子元素或文本的元素，而是获取当前元素的父元素，返回的是元素集合。

$(li).parent().css(background, #ccc); //选择当前元素的父元素

$(li).parents().css(background, #ccc); //选择当前元素的父元素及祖先元素

$(li).parentsUntil(div).css(background, #ccc); //选择当前元素遇到div 父元素停止

jQuery内容过滤选择器的过滤规则主要运用在DOM元素所包含的子元素或其文本内容上，主要包括以下四种过滤方法：

为了更好的学习，先写几个DOM元素的HTML结构：