.prop()

Метод .prop() получает значение свойства только для первого элемента в наборе сопоставленных элементов. Он возвращает undefined для значения свойства, которое не было установлено, или если набор сопоставленных элементов пуст. Чтобы получить значение для каждого элемента индивидуально, используйте цикл, такой как метод jQuery .each() или .map().

Атрибуты против свойств

Разница между атрибутами и свойствами может быть важна в определенных ситуациях. До jQuery 1.6 метод .attr() иногда учитывал значения свойств при извлечении некоторых атрибутов, что могло привести к несогласованному поведению. Начиная с jQuery 1.6, метод .prop() предоставляет способ явного извлечения значений свойств, в то время как .attr() извлекает атрибуты.

Например, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, и defaultSelected должны извлекаться и устанавливаться с помощью метода .prop(). До jQuery 1.6 эти свойства извлекались с помощью метода .attr(), но это не входило в область применения attr. У них нет соответствующих атрибутов, это только свойства.

Что касается булевых атрибутов, рассмотрим элемент DOM, определенный HTML-разметкой <input type="checkbox" checked="checked" />, и предположим, что он находится в переменной JavaScript под названием elem.

Согласно спецификации форм W3C, атрибут checked является булевым атрибутом, что означает, что соответствующее свойство равно true, если атрибут присутствует вообще — даже если, например, атрибут не имеет значения или имеет пустое значение или даже "false". Это относится ко всем булевым атрибутам.

Тем не менее, наиболее важный момент, который следует запомнить об атрибуте checked — это то, что он не соответствует свойству checked. Атрибут фактически соответствует свойству defaultChecked и должен использоваться только для установки начального значения чекбокса. Значение атрибута checked не изменяется при изменении состояния чекбокса, в то время как свойство checked изменяется. Поэтому кроссбраузерный способ определить, установлен ли чекбокс, — это использовать свойство:

• if ( elem.checked )
• if ( $( elem ).prop( "checked" ) )
• if ( $( elem ).is( ":checked" ) )

То же самое относится и к другим динамическим атрибутам, таким как selected и value.

• В Internet Explorer до версии 9 использование .prop() для установки свойства элемента DOM на любое значение, кроме простого примитивного значения (число, строка или булево), может привести к утечке памяти, если свойство не удалено (с помощью .removeProp()) перед удалением элемента DOM из документа. Для безопасной установки значений на объекты DOM без утечек памяти используйте .data().

Метод .prop() — удобный способ установить значение свойств, особенно при установке нескольких свойств, использовании значений, возвращаемых функцией, или установке значений для нескольких элементов одновременно. Он должен использоваться при установке selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, или defaultSelected. Начиная с jQuery 1.6, эти свойства больше нельзя устанавливать с помощью метода .attr(). У них нет соответствующих атрибутов, это только свойства.

Свойства обычно влияют на динамическое состояние элемента DOM, не изменяя сериализованный HTML-атрибут. Примеры включают свойство value элементов типа input, свойство disabled элементов типа input и button или свойство checked чекбокса. Метод .prop() следует использовать для установки disabled и checked вместо метода .attr(). Метод .val() следует использовать для получения и установки значения.

$( "input" ).prop( "disabled", false );
$( "input" ).prop( "checked", true );
$( "input" ).val( "someValue" );

Важно: метод .removeProp() не следует использовать для удаления встроенных свойств. Это приведет к непредсказуемому поведению. См. .removeProp() для получения дополнительной информации.

Вычисленные значения свойств

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

$( "input[type='checkbox']" ).prop( "checked", function( i, val ) {
  return !val;
});

Примечание: Если в функции установщика ничего не возвращается (т. е. function( index, prop ){}), или если возвращается undefined, текущее значение не изменяется. Это полезно для выборочной установки значений только при соблюдении определенных критериев.

• В Internet Explorer до версии 9 использование .prop() для установки свойства элемента DOM на любое значение, кроме простого примитивного значения (число, строка или булево), может привести к утечке памяти, если свойство не удалено (с помощью .removeProp()) перед удалением элемента DOM из документа. Для безопасной установки значений на объекты DOM без утечек памяти используйте .data().