JavaScript. Подробное руководство, 6-е издание

Флэнаган Дэвид

$("h1").toggleClass("hilite", false); //

Добавить класс во все элементы <h1> Добавить 2 класса в <р> после <h1> Передать функцию, чтобы добавить вычисляемый класс во все выбранные элементы

Удалить класс из всех элементов <р> Допустимо удалять несколько классов Удалить вычисляемый класс из элем.

Удалить все классы из всех <div>

Добавить класс, если отсутствует, или удалить в противном случае Переключить сразу два класса Переключить вычисляемый класс или классы

Действует как addClass Действует как removeClass

Имеет ли какой-нибудь <р> этот

класс? То же самое

is - более гибкий, чем hasClass

Обратите внимание, что метод

hasClass

не такой гибкий, как методы

addClass, removeClass

и

toggleClass.

Метод

hasClass

может работать только с одним именем класса и не поддерживает возможность передачи ему функции. Он возвращает true, если хотя бы один из выбранных элементов содержит указанный класс, и false - в противном случае. Метод

is

(описываемый в разделе 19.1.2) более гибкий и может использоваться для той же цели.

Эти методы объекта

jQuery

подобны методам свойства

classList

, о котором рассказывалось в разделе 16.5, но методы объекта

jQuery

работают во всех броузерах, а не только в тех, которые поддерживают свойство

classList

, определяемое стандартом HTML5. И, конечно же, методы объекта

jQuery

работают с множеством элементов и могут добавляться в цепочки вызовов методов.

19.2.4. Чтение и запись значений элементов HTML-форм

Метод

val

служит для чтения и записи значений атрибутов

value

элементов HTML-форм, а также для чтения и записи состояния выбора флажков, радиокнопок и элементов

<select>:

$("«surname").val // Получить значение текстового поля surname

$("«usstate").val // Получить единственное значение из элемента <select>

$("select«extras”).val // Получить массив значений из <select multiple>

$("input:radio[name=ship]:checked").val // Получить значение атрибута

// checked радиокнопки

$("«email").val("Invalid email address") // Установить значение текст, поля

$("input:checkbox").val(["opt1", "opt2"])

// Установить флажки с указанными именами

// или значениями

$("input:text").val(function { // Сбросить все текстовые поля

return this.defaultValue; // в значения по умолчанию

})

19.2.5.

Чтение и запись содержимого элемента

Методы

text

и

html

читают и записывают содержимое элемента или элементов в виде простого текста или разметки HTML. При вызове без аргументов метод

text

возвращает содержимое всех вложенных текстовых узлов из всех выбранных элементов в виде простого текста. Этот метод работает даже в броузерах, не поддерживающих свойства

textContent

и

innerText

(раздел 15.5.2).

Если вызвать метод

html

без аргументов, он вернет в виде разметки HTML содержимое только первого выбранного элемента. Для этой цели библиотека jQuery использует свойство

inпегHTML

:

x.html

– фактически то же самое, что и

x[0].innerHTML

.

Если методу

text

или

html

передать строку, она будет использована как содержимое элемента в виде простого текста или разметки HTML и заместит текущее его содержимое. Подобно другим методам записи, с которыми мы уже познакомились, этим методам можно также передать функцию, которая будет использована для получения строки с новым содержимым:

var title = $("head title").text // Получить заголовок документа

var headline = $("h1").html // Получить разметку html первого <h1>

$("h1").text(function(n,current) { // Добавить в каждый заголовок

return "§" + (n+1) + ": " + current // порядковый номер раздела

});

19.2.6. Чтение и запись параметров геометрии элемента

В разделе 15.8 мы узнали, насколько сложно бывает определить размер и координаты элемента, особенно в броузерах, не поддерживающих метод

getBoundingClient-Rect

(раздел 15.8.2). Библиотека jQuery упрощает эти вычисления, предоставляя методы, работающие в любых броузерах. Обратите внимание, что все методы, описываемые здесь, являются методами чтения, и лишь некоторые из них могут использоваться для записи.

Метод

offset

позволяет получить или изменить координаты элемента. Этот метод определяет координаты относительно начала документа и возвращает их в виде объекта со свойствами

left

и

top

, в которых хранятся координаты X и Y. Если передать методу объект с этими свойствами, он изменит координаты элемента в соответствии с указанными значениями. При необходимости он также установит CSS-атрибут

position

, чтобы сделать элемент позиционируемым: