Иногда возникает ситуация, когда необходимо выбрать все дочерние элементы. Для этого в jQuery есть селектор >. Например, у нас есть следующий html код:
И нам необходимо выбрать именно тег p, в котором находиться текст Тест 2 . Как видите сделать это не так легко, используя представленные выше выборки. Но в jQuery есть специальный селектор, который позволяет упростить нам задачу. Это селектор выбора следующего элемента +. Т.е. в нашем случае мы можем привязаться к div с id= logo и применив данный селектор выбрать следующий элемент:
<div id= logo >Тест 1</div>
Следующий вид выборки это выбор следующего элемента. Например, у нас есть следующий html-код:
Если же мы хотим выбрать дочерние элементы, например все абзацы <p> имеющие идентификатор logo, то нам необходимо прописать:
Аналогично мы может отобрать все элементы по классу, например class= logo :
Или если нам необходимо выбрать все элементы со страницы с id= logo , то запишем это следующим образом:
Мы с Вами вспомнили, как происходит выборка элементов в CSS. Как я уже говорил выше, что выборка элементов в jQuery осуществляется по аналогии с CSS. Так если мы хотим выбрать все абзацы, то пишем следующий код:
а если мы хотим применить данные свойства не только к абзацам с id= logo , а ко всем элементам с id= logo , тогда наш CSS выглядит следующим образом:
Теперь давайте посмотрим как происходит выборка дочерних элементов в CSS. Например нам необходимо применить приведенные выше CSS свойства не ко всем абзацам, а к абзацам с идентификатором logo. Тогда CSS будет выглядеть следующим образом:
Теперь когда браузер дойдет до элемента <p>Привет</p>, то к нему применяться эти свойства.
Что на самом деле происходит? Когда браузер пользователя обращается к нашему CSS-файлу, когда он доходит до какого-то селектора, то начинает выполнять свойства соответствующие элементу с данным селектором. Например в CSS файле:
Все что записано в фигурных скобках после селектора — это свойства элемента с данным селектором.
Все что идет до фигурных скобок называется селектор.
Для того, чтобы понять как происходит выборка элементов в jQuery давайте рассмотрим CSS файл:
Прежде, чем начать работать с элементом необходимо научиться его отбирать. Выборка элементов в jQuery построена также как и выборка в CSS.
JQuery основы. Выборка элементов. Часть 1
> > JQuery основы. Выборка элементов. Часть 1
WEB программирование от А до Я
JQuery основы. Выборка элементов. Часть 1 | Все о WEB программировании
Комментариев нет:
Отправить комментарий