В jQuery, селекторы в основном позаимствованы из CSS 1-3, также добавлены свои, что дало хороший набор инструментов для манипуляций с элементами в документе.
Если в названии класса или атрибута есть спец-символы (!"#$%&'()*+,./:;<=>?@[]^`{|}~), то они должны экранироваться.
Например, для элемента с id="foo.bar", будет такой селектор $("#foo\.bar").
Теги, ID и классы
$("*")
Все теги
$("p")
Все <p>
$("h1,div,p")
Все <h1>, <div>, <p>
$(":header")
Все заголовки <h1>, <h2> ...
$("#lastname")
Элемент с id="lastname"
$(".intro")
Все элементы с class="intro"
$(".intro,.demo")
Все элементы с классами «intro», «demo»
$(".intro.demo")
Все элементы с классом «intro» и «demo»
$(".intro .demo")
Все элементы с классом «demo», которые находится внутри «intro»
$("div > p")
Все <p>, которые являются прямыми потомками <div>
$("div p")
Все <p>, которые являются потомками <div>
$("div + p")
<p>, которые идут за <div>
$("div ~ p")
Все <p>, которые идут за <div>, в общем родителе
Атрибуты
$("[href]")
Все элементы с атрибутом href
$("[href][title]")
Все элементы с атрибутами href и title
$("[href='default.htm']")
Все элементы с атрибутом href="default.htm"
$("[href!='default.htm']")
Все элементы с атрибутом href, но без значения «default.htm»
$("[href$='.jpg']")
Все элементы с атрибутом href, с значением по маске «.jpg»
$("[title|='Tomorrow']")
Все элементы с атрибутом title, равным «Tomorrow» или начинающемуся с «Tomorrow», за которым следует дефис
$("[title^='Tom']")
Все элементы с атрибутом title, начинающимся с «Tom»
$("[title~='hello']")
Все элементы с атрибутом title, содержащим определенное слово «hello»
$("[title*='hello']")
Все элементы с атрибутом title, содержащим слово «hello»
Порядок элементов
$("p:first")
Первый <p>
$("p:last")
Последний <p>
$("tr:even")
Четные <tr>
$("tr:odd")
Нечетные <tr>
Поиск в родителе
$("div p:first-child")
Первый <p> в <div>
$("div p:first-of-type")
Первый <p> в <div>, игнорируя другие элементы
$("div p:last-child")
Последний <p> в <div>
$("div p:last-of-type")
Последний <p> в <div>, игнорируя другие элементы
$("div p:nth-child(2)")
Второй <p> в <div>
$("div p:nth-last-child(2)")
Второй с конца <p> в <div>
$("div p:nth-of-type(2)")
Второй <p> в <div>, игнорируя другие элементы
$("div p:nth-last-of-type(2)")
Второй с конца <p> в <div>, игнорируя другие элементы
$("div p:only-child")
<p>, который является единственным потомком в <div>
$("div p:only-of-type")
<p>, который является единственным потомком в <div>, игнорируя другие элементы
Поиск по индексу (индекс элементов начинается с нуля)
$("ul li:eq(3)")
Четвертый <li> в списке <ul>
$("ul li:gt(3)")
Все <li> с индексом > 3
$("ul li:lt(3)")
Все <li> с индексом < 3
Состояние элементов
$(":animated")
Элементы, которые находятся в процессе анимации
$(":focus")
Элемент в фокусе
$(":contains('Hello')")
Все теги, содержащие текст «Hello»
$("div:has(p)")
Элементы <div>, которые содержат хотя бы один элемент <p>
$(":empty")
Пустые элементы
$(":not(:empty)")
Непустые элементы
$(":parent")
Все элементы, у которых есть хотя бы один дочерний элемент или текст
$("p:hidden")
Скрытые элементы <p> (display: none;)
$("p:visible")
Видимые элементы <p>
$(":root")
Выбирает элемент, который является корнем документа (<html>)
$("p:lang(ru)")
Выбирает все элементы c указанным языком <p lang="ru">...</p>
Селект с множественным выбором (select multiple) весьма не удобен, при выборе часто забываешь нажимать сtrl и все сбрасывается. В место него можно использовать чекбоксы в выпадающем списке.
AJAX позволяет отправить и получить данные без перезагрузки страницы. Например, делать проверку форм, подгружать контент и т.д. А функции JQuery значительно упрощают работу.
