Селектор CSS (или JavaScript, если необходимо) для выбора DIV, которые содержат хотя бы один UL

Question

Селектор CSS (или JavaScript, если необходимо) для выбора DIV, которые содержат хотя бы один UL

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>

Я хочу выбрать все те divs, которые содержат по крайней мере одну ul в них. Таким образом, в приведенном выше примере кода это будут second_level_2, fourth_level_1 и fifth_level_2..

Какой CSS-селектор можно использовать для получения этого результата?

РЕДАКТИРОВАТЬ:

Если это невозможно с помощью CSS, вы можете предложить ответы с использованием JavaScript, хотя из-за характера моего фактического кода я бы действительно хотел избежать этого, если это возможно..

jsfiddle

Ahmad 22 сен. 2013, в 21:17

Источник

Теги:

html

css

css-selectors

2 ответа

Ещё вопросы

ced-b · Answer 1 · 2013-09-22T17-30-00.000Z

Вот два варианта: оба имеют недостатки, но вы можете их рассмотреть:

Вы можете вручную добавить второй класс в div с помощью ul:

<div class="fourth_level_1 div_with_ul_class">

Примечание. Если вы используете какой-либо динамический язык на сервере, например PHP, это может быть реализовано довольно легко, без ручного кодирования.

Или, если вы хотите быть динамичным, я рекомендую jQuery:

$("div > ul").parent().addClass("div_with_ul_class");

Indy · Answer 2 · 2013-09-23T02-24-00.000Z

Родительский селектор недоступен в CSS, несмотря на множество запросов на его добавление.

jQuery имеет хороший селектор, который знает :has; http://api.jquery.com/has-selector/

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

Был бы селектором jQuery.