CSS定位子元素包含特定 class 的父元素
要定位子元素包含特定 class 的父元素,可以使用 CSS 选择器中的 :has()
选择器,但是这个选择器目前还没有得到广泛的浏览器支持。目前使用 :has()
选择器的最佳方式是使用 jQuery 或其他类似的 JavaScript 库。以下是一个使用 jQuery 的例子:
<div class="parent">
<div class="child">不合适的子元素</div>
</div>
<div class="parent">
<div class="child other-class">正确的子元素</div>
</div>
// 使用 jQuery 的选择器定位父元素
var parent = $('.parent:has(.child.other-class)');
在这个例子中,我们使用了 jQuery 的 :has()
选择器,它会选择包含匹配的子元素的父元素。我们选择了所有 class 包含 parent
并且包含子元素 class 为 child other-class
的父元素。
请注意,:has()
在大多数原生的浏览器中并不支持,因此在开发时,请考虑使用更常规的解决方案,如通过 DOM 遍历或其他方法手动查找父元素。