jquery получить дочерний элемент

Содержание

  1. Определение и применение
  2. jQuery синтаксис:
  3. Добавлен в версии jQuery
  4. Значения параметров
  5. Пример использования
  6. пример
  7. Пример first-child

Определение и применение

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

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

jQuery метод .children(), как и большинство методов для фильтрации не возвращает текстовые узлы, чтобы получить все дочерние элементы, включая текстовые узлы и узлы комментариев Вы можете воспользоваться методом .contents().

jQuery синтаксис:

Добавлен в версии jQuery

Значения параметров

Параметр Описание selector Строка селектор, использующаяся в качестве дополнительного фильтра. Если дополнительно указывается селектор, то выбор дочернего элемента (добавление в коллекцию jQuery) осуществляет только в том случае, если он соответствует этому селектору. Необязательный параметр.

Пример использования

В этом примере с использованием jQuery метода .children() мы выбираем все дочерние элементы элементов в документе, и с помощью метода .css() задаем им сплошную границу размером 1 пиксель зеленого цвета со всех сторон, в результате чего стили были применены ко всем элементам в документе.

Во втором случае мы используем метод .children() с дополнительным фильтром, в которм мы указываем, что выбор дочернего элемента осуществляет только в том случае, если он соответствует классу active, в результате чего был выбран только один элемент в документе.

Результат нашего примера:

Пример использования метода .children()

В следующем примере мы рассмотрим отличие методов .children() и .find():

В этом примере с использованием jQuery метода .click() мы при нажатии на элемент (кнопка) с классом children вызываем функцию, которая с помощью метода .css() устанавливает всем элементам цвет заднего фона белый. Кроме того, с использованием jQuery метода children() выбираем все дочерние элементы элементов

Также с использованием jQuery метода .click() мы при нажатии на элемент (кнопка) с классом find вызываем функцию, которая с помощью метода .css() устанавливает всем элементам цвет заднего фона белый. С использованием jQuery метода .find() выбирает все потомки элементов

Результат нашего примера:

Отличие метода .find() от .children() jQuery перемещения

пример

Чтобы выбрать дочерние элементы элемента, вы можете использовать метод children() .

Измените цвет всех .parent элементов элемента .parent :

Метод принимает необязательный аргумент selector который может использоваться для фильтрации возвращаемых элементов.

В jQuery есть способ быстро найти первый дочерний элемент любого элемента. Делается это при помощи метода .find(selector) и передачи в него параметра «:first-child» .

Пример first-child

Есть список

    , в котором нужно найти первый элемент

Источник: computermaker.info

Техника и Гаджеты
Добавить комментарий