Может ли jquery.find () выбрать только прямых потомков?

0

Какой аргумент я должен предоставить jQuery.find() для выбора элементов children и других элементов? Я не могу привести селектор с помощью ">", а "*" выберет всех потомков, а не только прямых детей.

Я знаю jQuery.children(), но это для библиотеки, поэтому пользователь может предоставить свой собственный селектор, и я хочу убедиться, что у них есть способ выбрать только прямых детей (без добавления большого количества моих собственных логика).

редактировать

Я хочу использовать jQuery.find() только для поиска элементов в дочерних элементах первого уровня родительского элемента, а не для детей.

Пример:

<parent>
  <child-1>
    <child-2></child-2>
  </child-1>
  <child-1>
  </child-1>
</parent>

Я хочу искать только элементы child-1 а не их дети (например, child-2)

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

Для более подробного объяснения это угловая директива, которая идет на элемент таблицы. Директива должна иметь возможность находить строки таблицы, но предназначена для использования в широком спектре шаблонов, поэтому у нее может быть селектор для строк. Иногда строки не имеют четких функций, кроме того, что они являются дочерними div-элементами для исходного элемента; в других случаях ряды являются внуками или даже правнуками.

  • 0
    Можете ли вы привести пример использования? Я не понимаю, что ты пытаешься сделать.
  • 0
    У меня есть функция, которая принимает jQuery и селектор, и функция должна быть в состоянии выбрать детей в некоторых случаях, но выбрать внуков в другом случае. В обоих случаях требуется некоторая глубина в селекторе, но, похоже, что .find () на самом деле не работает с определенной глубиной (поскольку нет способа определить глубину относительно исходного элемента).
Показать ещё 5 комментариев

3 ответа

3
Лучший ответ

Начните свой селектор с помощью > как вы упомянули в своем вопросе. Попробуй:

var s = ".classA",
    n = $('#wrapper').find('>'+s).length;

alert('Found '+ n +' direct children of #wrapper with the "'+ s +'" selector.'); // 3
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id="wrapper">
    <div class="classA"></div>     <!-- Selected -->
    <div class="classA">           <!-- Selected -->
        <div class="classA"></div> <!-- Ignored -->
    </div>
    <div class="classC">
        <div class="classA"></div> <!-- Ignored -->
    </div>
    <div class="classB">
        <div class="classB"></div>
    </div>
    <div class="classA"></div>     <!-- Selected -->
</div>

Или используйте $.children(), как вы упомянули в своем вопросе:

var s = ".classA",
    n = $('#wrapper').children(s).length;

alert('Found '+ n +' direct children of #wrapper with the "'+ s +'" selector.'); // 3
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id="wrapper">
    <div class="classA"></div>     <!-- Selected -->
    <div class="classA">           <!-- Selected -->
        <div class="classA"></div> <!-- Ignored -->
    </div>
    <div class="classC">
        <div class="classA"></div> <!-- Ignored -->
    </div>
    <div class="classB">
        <div class="classB"></div>
    </div>
    <div class="classA"></div>     <!-- Selected -->
</div>
  • 0
    Ведущий > не является стандартным CSS, верно? Я даже не подумал попробовать это из-за этого и на странице API .find, не упоминая ничего подобного. Работал как шарм, хотя.
  • 0
    Вы не сможете использовать его отдельно с ведущим > , но здесь он применяется к элементу DOM, на который ссылается jQuery, поэтому он не является действительно "ведущим".
1

Используйте Immediate Child Elements с помощью > этого кода, который вам нужен:

elemnt.find("> selector");

Это должно делать свое дело.

1

Я знаю jQuery.children(), но это для библиотеки, поэтому пользователь может предоставить свой собственный селектор

Но JQuery .children() получает селектор в качестве параметра:

.children([селектор])
Описание. Получите дочерние элементы каждого элемента в наборе согласованных элементов, необязательно отфильтрованных селектором.

https://api.jquery.com/children/

Ещё вопросы

Сообщество Overcoder
Наверх
Меню