0

假设我必须关注 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 的情况下执行此操作。

4

4 回答 4

1

您可以稍微更改 html 将 CSS 类添加到具有跨度的 div 中，并将其用作“选择器”

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

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

于 2013-09-06T15:54:39.487 回答
1

您正在寻找类似:has伪类/:parent伪类/<组合器之类的东西，它从未进入 CSS。目前没有。将它添加到现有引擎显然存在重大的性能问题，因此它被多次提出和破坏。:-) 您可能会发现这篇关于该主题的简短文章很有趣。

于 2013-09-06T15:54:55.423 回答
0

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

于 2013-09-06T15:54:52.767 回答
0

用 css 是不可能的。没有“父”选择器。没有“祖先”选择器。没有，也没有:has，也不会有主题指标。

只是为了不让你兴奋不已，这对 JavaScript 来说并不难：

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

http://jsfiddle.net/epwUS/

于 2013-09-06T16:00:12.633 回答