Parent()
Возвращает родительские элементы всех элементов первоначального обернутого набора, расположенные на один уровень выше.
Параметры
селектор

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

Children()
Возвращает новый набор, содержащий уникальные дочерние элементы (находящиеся на первом уровне вложенности) обернутых элементов.
Параметры
селектор

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

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

PrevAll()
Возвращает обернутый набор, содержащий все соседние элементы, предшествующие элементам первоначального обернутого набора.
Параметры
селектор

PrevUntil()
Возвращает обернутый набор, содержащий все соседние элементы, предшествующие элементам первоначального обернутого набора, за исключением элемента, соответствующего селектору.
Параметры
селектор

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

NextAll()
Возвращает обернутый набор, содержащий все соседние элементы, следующие за элементами первоначального обернутого набора.
Параметры
селектор

NextUntil()
Возвращает обернутый набор, содержащий все соседние элементы, следующие за элементами первоначального обернутого набора, за исключением элемента, соответствующего селектору.
Параметры
селектор

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

Is()
Проверяет обернутый набор на наличие, по крайней мере, одного элемента, соответствующего заданному селектору. Возвращает true , если заданному селектору соответствует хотя бы один элемент, в противном случае false .
Параметры
селектор

Find()
Возвращает новый обернутый набор, содержащий все элементы, дочерние по отношению к элементам из первоначального набора, соответствующие заданному селектору.
Параметры
селектор

Size()
Возвращает количество элементов в обернутом наборе.
Параметры
нет

Get()
Возвращает один элемент в соответствии с заданным индексом или массив элементов, если параметр не указан. Отрицательный индекс ведет отсчет с конца обернутого набора элементов.
Параметры
число, задающее индекс возвращаемого элемента

ToArray()
Возвращает массив элементов, содержащихся в обернутом наборе.
Параметры
нет

Index()
Возвращает порядковый номер заданного элемента обернутого набора. Если указанный элемент отсутствует, возвращается значение -1 . Если параметр не задан, возвращает индекс первого элемента среди элементов одного уровня вложенности.
Параметры
элемент или селектор, определяющие или идентифицирующие ссылку на элемент

Add()
Возвращает новый набор, содержащий копию элементов первоначального набора, в который добавлены элементы, определенные параметром.
Параметры
элемент, селектор, массив элементов, фрагмент html-разметки

Each()
Позволяет перебрать все элементы выборки страницы и произвести серию действий над каждым из них. Вызываемой функции передаются два параметра — индекс элемента набора и сам элемент, который устанавливается в качестве контекста функции this .
Параметры
функция

Map()
Вызывает функцию для каждого элемента в обернутом наборе и возвращает полученные значения в виде массива JavaScript. Функции передаются два параметра — индекс элемента внутри набора и сам элемент.
Параметры
функция

End()
Используется внутри цепочки методов jQuery, возвращает предыдущий обернутый набор, чтобы применить к нему последующие операции.
Параметры
нет

AndSelf()
Объединяет два самых верхних обернутых набора в единый набор.
Параметры
нет

2. Фильтрующие методы

First()
Возвращает из обернутого элемента только первый элемент.
Параметры
нет

Eq()
Возвращает из обернутого набора только один элемент. Отрицательное значение индекса ведет отсчет с конца набора.
Параметры
число, соответствующее индексу возвращаемого элемента

Last()
Возвращает из обернутого элемента только последний элемент.
Параметры
нет

Slice()
Возвращает набор элементов, содержащий элемент с начальным индексом и элементы до конечного индекса. Если конечный индекс отсутствует, то элементы от начального и до конца набора. Отрицательный индекс ведет отсчет элементов с конца набора, -1 вернет последний элемент.
Параметры
начальный индекс, конечный индекс (не обязательно)

Filter()
Удаляет из обернутого набора элементы, не соответствующие правилу отбора. Возвращает копию первоначального обернутого набора, из которого удалены указанные элементы. Если параметром является функция, она будет вызвана для каждого элемента в наборе, чтобы проверить, соответствует ли элемент заданному критерию отбора. Если для элемента будет возвращено значение false , то он будет удален из набора.
Параметры

Not()
Удаляет из выбранного множества все элементы, соответствующие заданному выражению селектора. Возвращает копию первоначального обернутого набора, из которого удалены указанные элементы. Если параметром является функция, она будет вызвана для каждого элемента в наборе, чтобы проверить, соответствует ли элемент заданному критерию отбора. Если для элемента будет возвращено значение false , то он будет удален из набора.
Параметры
элемент, селектор, массив или функция

Has()
Возвращает новый обернутый набор, содержащий элементы из первоначального набора, имеющие вложенные элементы, соответствующие заданному параметру.
Параметры
элемент или селектор

Всем привет, хабрчане.
Сегодня CSS окружает нас вокруг, и даже маломайский программист должен понимать его.
Самыми используемыми являются старые добрые #id и.class они знакомы всем, кто хоть раз работа с CSS.
На этом конечно мир Селекторов далеко не ограничивается. Я уже довольно давно работаю с CSS и хочу поделится как можно большим количеством полезных селекторов. Все они определяют стиль того или иного объекта.

CSS Selectors

Объясняю многие селекторы применимо к указанному примеру.

.class

(Пр. .main) Данный селектор объединяет все элементы с классом «main». Родился он давно и активно учувствует в разработке.

#id

(Пр. #Block_Form) Этот селектор объедение элементы с id=«Block_Form» В чем скажите разница между.class и #id - а разницу можно понять на примере: то что ПАСПОРТНЫЙ НОМЕР = id, ФАМИЛИЯ = class. Также немало важно то, что - Идентификатор (id) можно вызвать из скрипта используя функцию GetElementById, в отличие от класса.
Класс может быть использован многократно, идентификатор же должен быть уникальным.

*

Выбирает, объединяет все элементы
(Пр. *) { background-color:yellow; })

element

(Пр. p) Объединяет все элементы тега p.

element,element

(Пр. div,p) Объединяет все элементы div и все элементы p
.
Так же в эту группу можно выделить похожие селекторы:

element element

(Пр. div p) Выбирает все элементы p внутри div.

element>element

(Пр. div>p) Объединяет все p для которых родителем выступает div.

element+element

(Пр. div+p) Объединяет все p которые расположены сразу после div.

(Пр. ) Объединяет все элементы с атрибутом target

(Пр. ) Объединяет все элементы с заданным target="_blank"

(Пр. ) Объединяет все элементы, которые в своем title содержат «Apple»

(Пр. ) Объединяет все элементы с атрибутом class начиння с «top»

Все теги написаны были без "<>".

Дальше считаю обязательно нужно показать именно эти селекторы, так как они являются очень важными и крайне часто используются в решении многих задач - от Простых анимашек с наведением курсора, оформлением ссылок, картинок и прочего до более глобальной цели уменьшения кода в целом.

Так же их называют Псевдокласы:

:link

(Пр. a:link) Объединяет все ссылки, которые еще не посещались (Пр. a:visited) Объединяет все ссылки, которые пользователь уже успел посетить

:active

(Пр. a:active) Псевдокласс:active определяет стиль для активной ссылки. Активной ссылка становится при нажатии на нее.

:hover

(Пр. a:hover) Когда проводишь мышкой, ссылка может менять стиль

:focus

(Пр. input:focus) Изменяет стиль при фокусировке. на практике часто используется для подсветки полей формы при фокусировке на нем

:first-letter

(Пр. p:first-letter) Определяет стиль для первого символа в тексте элемента

:first-line

(Пр. p:first-line) Определяет стиль первой строки. Использую для изменения цвета текста, цвета фона и шрифта, но как показывают народные хабрумельцы на этом его функции не ограничиваются

:first-child

(Пр. p:first-child) Что бы просто объяснить - применяет стилевое оформление к первому дочернему элементу своего родителя. В примере если р есть первым элементом своего родителя
Дальше идут два очень интересных класса:

:before

(Пр. p:before)

:after

(Пр. p:after)
Они применяются в тех случаях, когда - нужно отобразить нужный контент до или после содержимого элемента, к которому он добавляется. Работает совместно со свойством content:. Так же я их использую как дополнительные элементы вместо div, в таком случае нужно прописывать content:"";. Также нужно помнить о том, что при добавлении:before к блочному элементу, значение свойства display может быть только: block, inline, none, list-item. Все остальные значения будут трактоваться как block. При добавлении:before к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline.
:before наследует стиль от элемента, к которому он добавляется.

:lang(language)

(Пр. p:lang(it)) Довольно простой, но порой нужный элемент - для примера: Определяет стиль каждого p с атрибутом lang, значение которого начинается с «it»

Селекторы CSS3

Данные селекторы вызывают большой интерес, так как они мало кем используются и, конечно, хочется разобраться как ими пользоваться, поэтому буду приводить примеры. Также в данной группе селекторов в многострадальном IE8 и раньше DOCTYPE должен быть объявлен.

element1~element2

(Пр. p~ul)
p~ul { background:red; } Устанавливает цвет фона для всех ul элементов, которые предшествуют p с таким же родителем. Грубо говоря - на этом примере, красным будет бэкграунд только у тех «списков» которые стоят после родителя тега р.

• Item
• Item
• Item

- в этом случае ничего не произойдет, а в

• Item
• Item
• Item

а в этом случае поля Айтемов будут иметь бэк-цвет - красный.

(Пр. a) По примеру определяет стиль каждого a для которого значение элемента src начинающегося с «https». Вот еще пример:

Item4

Проще говоря – данный селектор дает возможность установить цвет фона на всех div элементов, которые имеют значение атрибута класса, начинающихся с «тест» – а именно item3, item4.

(Пр. a) Выбирает каждый тег a, для которого SRC значение атрибута заканчивается на ". PDF. И вот еще один наглядный пример:

Item4

На этом примере очень хорошо будет видно использование данного селектора, а именно в Красный цвет перекрасятся Item1 (по тому что класс заканчивается на _test) и item3.

(Пр. a) Выбирает каждый тег a, для которого значение атрибута SRC содержит подстроку «w3schools».

Item4