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

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

Метод

val()

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

value

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

<select>:

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

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

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

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

<b>                                          // checked радиокнопки</b>

<b>$(&quot;«email&quot;).val(&quot;Invalid email address&quot;)  // Установить значение текст, поля</b>

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

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

<b>                                          // или значениями</b>

<b>$(&quot;input:text&quot;).val(function() {          // Сбросить все текстовые поля</b>

 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() // Получить заголовок документа 

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

$("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

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

<b>var elt = $(&quot;#sprite&quot;);      // Элемент, который требуется переместить </b>

var position = elt.offset(); // Получить текущие координаты

position.top += 100; // Изменить координату У

elt.offset(position); // Переместить элемент в новую позицию

<b>// Переместить все элементы &lt;h1&gt; вправо на расстояние, зависящее от их</b>

// положения в документе

$('h1').offset(function(index,curpos) {

 return {left: curpos.left + 25*index, top:curpos.top};

}):

Метод

position()

похож на метод

offset(),

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

offsetParent

, ссылающееся на родительский элемент, относительно которого определяются координаты. Позиционируемые элементы всегда играют роль начала координат для своих потомков, но некоторые броузеры дают эту роль и некоторым другим элементам, таким как ячейки таблицы. Роль начала координат в библиотеке jQuery могут играть только позиционируемые элементы, и метод

offsetParent()

объекта

jQuery

отображает каждый элемент на ближайший позиционируемый вмещающий элемент или на элемент

<body>

. Следует отметить не совсем удачный выбор имен этих методов:

offset()

возвращает абсолютные координаты элемента относительно начала документа, а метод

position()

возвращает смещение элемента относительно его ближайшего предка

offsetРаrent ().