Как выбрать li с определенным классом?

<ul id="attached_deals_tab" class="nav nav-tabs">
  <li class="active">
    <a data-toggle="tab" href="#Test1">Test1</a>
  </li>
  <li class="">
    <a data-toggle="tab" href="#Test2">Test2</a>
  </li>
</ul>

С jquery, как это, я мог бы сказать, получить мне все элементы списка:

$('#attached_deals_tab li');

но как я могу сказать, покажите мне только li и class="active" ? В одну строчку, пожалуйста.

Я знаю, как это отрицать:

$('#attached_deals_tab li:not(.active)');

но не наоборот...

13
dom-traversal jquery jquery-selectors

5 ответов

$('#attached_deals_tab li.active');
18

Это должно сделать это, синтаксис точно такой же, как в CSS:

$('#attached_deals_tab li.active');
4

вы можете просто использовать класс один раз ul id указан:

$("#attached_deals_tab .active");

если у вас нет ничего, кроме lis там, и что-то также применяется active класс, что было бы странно.

1

просто, do

$('#attached_deals_tab li.active').(...)
0

вы должны использовать дочерний селектор для подготовки кода для возможных будущих вложенных списков:

$('#attached_deals_tab > .active')

он будет выбирать только прямые детей. Согласно спецификации, в ul может быть только li элементы как его дочерние, поэтому при использовании дочернего селектора,.active должно хватить, нет необходимости указывать li.active.

вложенными списками я имею в виду что-то вроде этого:

<ul id="attached_deals_tab">
    <li class="active"></li>
    <li></li>
    <li>
        <ul>
            <li class="active"></li>
            <li></li>
        </ul>
    </li>
</ul>

чтение документация по селекторам jQuery также очень поможет.

0