0

假设我有这样的层次结构：

<div class="first_level">
  <div class="second_level_1">
    <div class="third_level_1">
      <div class="fourth_level_1">
        <ul><li></li><li></li></ul>
      </div>
      <div class="fourth_level_2">
        <div class="fifth_level_1">
        </div>
        <div class="fifth_level_2">
          <ul><li></li><li></li></ul>
        </div>
      </div>
    </div>
  </div>
  <div class="second_level_2">
    <ul><li></li><li></li></ul>
  </div>
</div>

我想选择所有这些 div，其中至少包含一个ul。所以在上面的示例代码中，那将是divssecond_level_2和..fourth_level_1fifth_level_2

我可以使用什么 CSS 选择器来获得这个结果？

编辑：

如果单独使用 CSS 是不可能的，您可以使用 JavaScript 提出答案，尽管由于我的实际代码的性质，如果可能的话，我真的很想避免这种情况..

jsfiddle

4

2 回答 2

2

这里有两个选项 - 都有缺点，但您可以考虑它们：

您可以使用以下命令手动向 div 添加第二个类ul：

<div class="fourth_level_1 div_with_ul_class">

注意：如果您在服务器上使用某种动态语言，例如 PHP，这实际上可以很容易地实现，无需手动编码。

或者如果你想要动态，我推荐 jQuery：

$("div > ul").parent().addClass("div_with_ul_class");
于 2013-09-22T19:27:20.480 回答
1

父选择器在 CSS 中不可用，尽管有很多要求添加它。

jQuery 有一个不错的选择器，称为:has; http://api.jquery.com/has-selector/

$('div:has(ul)');

将是 jQuery 选择器。

于 2013-09-23T04:12:38.937 回答