Основы jQuery и Bootstrap
.pdfВведение в веб-разработку
Основы jQuery и Bootstrap
www.epam.com |
EPAM Systems |
|
|
jQuery. Пример.
jQuery = window.jQuery = window.$
•$("div")
•window.$("div")
•jQuery("div")
•window.jQuery("div")
www.epam.com |
EPAM Systems |
|
|
jQuery. Функция jQuery
•Существует несколько способов определения функции
•jQuery(выражение, [контекст])
•jQuery(html, [Document])
•jQuery(элементы)
•jQuery(вызов)
www.epam.com |
EPAM Systems |
|
|
jQuery. Функция jQuery
•jQuery(выражение, [контекст])
•$("div") —набор всех элементов div на странице
•$("#mydiv") — набор с одним элементом c id mydiv
•$(".myclass") — набор элементов, содержащих класс myclass
•$("[id=mydiv]") — все элементы с id mydiv
•$("[class=myclass]") — набор элементов,
содержащих только класс myclass
www.epam.com |
EPAM Systems |
|
|
jQuery. Функция jQuery
•jQuery(html, [Document])
•$("<div><strong>New div</strong></div>")
.appendTo(document.body); -
www.epam.com |
EPAM Systems |
|
|
jQuery. Функция jQuery
•jQuery(элементы)
•$(document.body).append($("<div>New div</div>"));
www.epam.com |
EPAM Systems |
|
|
jQuery. Аксессоры объектов jQuery
Методы/Свойства |
Описание |
|
|
size() |
возвращает то же что и length |
|
|
eq (позиция) |
возвращает jQuery с одним элементом, |
|
находящемся в исходном наборе по номеру |
|
позиция |
|
|
get([индекс]) |
возвращает один элемент, содержащийся в |
|
наборе на позиции индекс, если не указан, |
|
то массив всех элементов |
|
|
index(объект) |
возвращает номер элемента в наборе |
|
|
length |
показывает количество элементов |
|
находящихся в объекте |
|
|
selector |
возвращает строку с условием выбора |
|
элементов |
|
|
context |
возвращает ссылку на контекст, заданный |
|
при выборе элементов |
|
|
www.epam.com |
EPAM Systems |
|
|
Селекторы
Селекторы
www.epam.com |
EPAM Systems |
|
|
jQuery. Пример селекторов
Селектор |
Описание |
|
|
|
|
* |
Все элементы |
|
|
|
|
E |
Элемент типа E. |
|
|
|
|
E:enabled |
Активный элемент Е пользовательского интерфейса. |
|
|
|
|
E.warning |
Элемент E с классом "warning" (class="warning"). |
|
|
|
|
#myid |
Элемент с ID равным "myid" |
|
|
|
|
E:not(s) |
Элемент E, не соответствующий простому селектору s. |
|
|
|
|
E F |
Элемент F, являющийся потомком элемента E |
|
|
|
|
E > F |
Элемент F, являющимся дочерним элементом элемента E. |
|
|
|
|
E + F |
Элемент F, которому непосредственно предшествует |
|
элемент E. |
||
|
||
|
|
|
E ~ F |
Элемент F, которому предшествует элемент E. |
|
|
|
|
E,F,G |
Выбрать все элементы E, F и G. |
|
|
|
www.epam.com |
EPAM Systems |
|
|
jQuery. Пример селекторов
Селектор |
Описание |
|
|
|
|
E[foo] |
элемент E с аттрибутом "foo". |
|
|
|
|
E[foo=bar] |
Элемент E, у которого значение атрибута "foo" |
|
равно "bar". |
||
|
||
|
|
|
E[foo^=bar] |
Элемент E, у которого значение атрибута "foo" |
|
начинается с "bar". |
||
|
||
|
|
|
E[foo$=bar] |
Элемент E, у которого значение атрибута "foo" |
|
оканчивается на "bar". |
||
|
||
|
|
|
E[foo*=bar] |
E, у которого значение атрибута "foo" содержит |
|
"bar". |
||
|
||
|
|
www.epam.com |
EPAM Systems |
|
|