我正在寻找一个选择器,如果它们具有特定的子元素,它将选择所有元素。例如,选择所有<div>带孩子的人<span>。
<div>
<span>
可能?
如果元素包含特定的子元素,是否可以选择?
不幸的是还没有。
在CSS2和CSS3选择器的规格不允许任何形式的亲本选配。
从现在开始,这是关于此帖子准确性的免责声明。CSS中的父选择器已经讨论了很多年。由于尚未达成共识,因此变化不断发生。我将尝试使此答案保持最新状态,但是请注意, 由于规格的更改,可能存在一些不准确之处 。
较早的“选择器4级工作草案”描述了一项功能,该功能可以指定选择器的“主题”。
主题将是选择器链中要应用样式的元素。
HTML范例
<p><span>lorem</span> ipsum dolor sit amet</p> <p>consecteture edipsing elit</p>
该选择器将为span元素设置样式
span
p span { color: red; }
该选择器将为p元素设置样式
p
!p span { color: red; }
最新的“选择器第4级编辑器草案”包括“关系伪类::has()”
:has()
:has()允许作者根据其内容选择元素。我的理解是选择它是为了与jQuery的自定义:has()伪选择器* 兼容。
无论如何,继续上面的示例,选择p包含一个的元素span可以使用:
p:has(span) { color: red; }
*这使我想知道jQuery是否实现了选择器主题,而主题是否仍保留在规范中。