Question

说我必须关注html：

<div class='row'>

  <div class='cell'> 
    <span class='image'> </span>
    Image Cell
  </div>

  <div class='cell'>
     Regular Cell
  </div>

</div>

是否有可能明确地选择包含span元素的div与没有span元素作为其第一个子元素的div单元格？不用js尝试这个。

Answer 1

您可以更改html，将一个CSS类添加到具有span的div中，并将其用作“选择器”

 <div class='cell haschild'> 
   <span class='image'> </span>
   Image Cell
 </div>

 <div class='cell'>
    Regular Cell
 </div>

Answer 2

您正在寻找类似于:has伪类/ :parent伪类/ <组合器的东西，它们从未进入CSS。目前没有一个。将它添加到现有引擎中显然存在显着的性能问题，因此它不止一次被提升和破灭。 :-)你可能会发现this brief article对这个主题感兴趣。

Answer 3

不。你不是第一个需要这个的人。几年前我在一个论坛上和一个熟悉CSS和DOM解析的人以及如何在浏览器中应用样式，显然“父”选择器会导致各种问题和资源开销，这是不值得的。< / p>

Answer 4

用css是不可能的。没有“父”选择器。没有“祖先”选择器。没有:has，也没有a subject indicator。

只是为了不让你高高在上，这对JavaScript来说并不难：

Array.prototype.forEach.call(document.querySelectorAll(".cell"), function (el) {
    if (el.querySelector("span")) {
        //found!
    }
});

http://jsfiddle.net/epwUS/

CSS：是否可以选择包含某些元素的父div？

4 个答案: