Вообще говоря, полное описание по селекторам, можно найти в API, в разделе селекторы. В данном посте посмотрим на некоторые простые примеры, построенные на функциях из API
Элементарщина
|
1 2 3 4 |
$('*') // найдет все элементы DOM $('#id_of_element')// найдет элемент DOM, с id_of_element $('.class') // найдет все элементы DOM с классом .class $('sel1,sel2,selN') // найдет все элементы, где хотя бы один из селекторов входит в множество sel1,sel2,selN |
Иерархические селекторы
Пусть у нас есть следующая иерархическая структура
|
1 2 3 4 5 |
... <div id='parent'> <a class="SomeLink" href="http://digital-flame.ru/">Блог программиста</a> </div> ... |
Тогда, чтобы подобраться к тегу <a></a>, мы можем написать
|
1 |
$('div#parent a.someLink'); |
Конечно, можно было и не усложнять, написав $(‘.someLink’), но для иллюстрации того как можно подбираться к иерархическим тегам был сделан этот пример.
Также есть вот какая информация по иерархическим селекторам
|
1 2 3 4 5 6 7 8 9 10 |
$('#parent>a') // выберет a, у которых родительский элемент с id='parent' $('#some_id~.someclass') // выберет те элементы c классом .someclass, //до которых непосредственно стоят элементы #some_id //Например <div id="some_id"></div> <div class="someclass"></div> //Выборка даст div с классом class="someclass" |
Выборка по атрибуту
|
1 |
$('p[.someclass]') // выберет все p c атрибутом someclass |
Также есть классная информация по выборке элементов по другим атрибутам.