Поиск дочерних элементов
.children()
Находит дочерние элементы. Метод имеет один вариант использования:
.children([selector]):jQuery1.0
Возвращает все дочерние элементы выбранных элементов. При необходимости, можно указать селектор selector для фильтрации результата.
Примеры использования:
$("div").children() | вернет элементы, которые лежат непосредственно внутри div-элементов. |
$("div").children(".bigBlock") | вернет элементы класса bigBlock, которые лежат непосредственно внутри div-элементов. |
$("#lArea").children(".lBlock") | вернет элементы класса lBlock, которые лежат непосредственно внутри элемента с идентификатором lArea. |
В действии
Выделим элементы, содержащиеся внутри элементов списка (и заодно узнаем, что нужно для приготовления суши):
~lt~!DOCTYPE html~gt~ ~lt~html~gt~ ~lt~head~gt~ ~lt~style~gt~ ul{list-style-type:none; margin-left:17px; padding:4px} li{margin:3px} .colmn{float:left; margin-right:20px; background-color: #eee;} ~lt~/style~gt~ ~lt~script src="https://code.jquery.com/jquery-latest.min.js"~gt~~lt~/script~gt~ ~lt~/head~gt~ ~lt~body~gt~ ~lt~ul class="colmn"~gt~ ~lt~li style="font-style:italic"~gt~Суши~lt~/li~gt~ ~lt~li~gt~Рыба~lt~/li~gt~ ~lt~li~gt~Водросли~lt~/li~gt~ ~lt~li~gt~Рис~lt~/li~gt~ ~lt~li~gt~ Соус: ~lt~ul~gt~ ~lt~li~gt~Уксус~lt~/li~gt~ ~lt~li~gt~Соль~lt~/li~gt~ ~lt~li~gt~Сахар~lt~/li~gt~ ~lt~/ul~gt~ ~lt~/li~gt~ ~lt~li~gt~Авокадо~lt~/li~gt~ ~lt~li~gt~ Инвентарь: ~lt~ul~gt~ ~lt~li style="font-style:italic"~gt~Приспособления~lt~/li~gt~ ~lt~li~gt~Кастрюля~lt~/li~gt~ ~lt~li~gt~"Коврик"~lt~/li~gt~ ~lt~li~gt~Нож~lt~/li~gt~ ~lt~/ul~gt~ ~lt~ul~gt~ ~lt~li style="font-style:italic"~gt~Приборы~lt~/li~gt~ ~lt~li~gt~Тарелочки~lt~/li~gt~ ~lt~li~gt~Пиалочки~lt~/li~gt~ ~lt~li~gt~Палочки~lt~/li~gt~ ~lt~/ul~gt~ ~lt~/li~gt~ ~lt~/ul~gt~ ~lt~script~gt~ $("li").children().css("border", "1px solid red"); ~lt~/script~gt~ ~lt~/body~gt~ ~lt~/html~gt~