Когда уместно использовать .attr() для установки/изменения значений атрибутов?

Пожалуйста, найдите время, чтобы прочитать вопрос полностью, прежде чем предположить, что это дубликат .prop() vs .attr ()

Я прочитал .prop() vs .attr() и несколько дубликатов и связанных с ними не -дубликаты. Мой вопрос: когда уместно передавать значения .attr() при работе с HTML и DOM?

Конечно, простой ответ: «Почему, всякий раз, когда вы хотите установить или изменить значение атрибута, в противном случае (и обычно) используйте .prop()».

Но что я действительно хочу знать, так это когда ты захочешь. В документах jQuery для этого метода я вижу примеры установки таких вещей, как id, src alt и title для img элементов. Но документы, похоже, не дают никаких указаний на то, почему вы можете захотеть это сделать, вместо использования .prop() для установки этих конкретных атрибутов.

Что мне нужно, так это руководящий принцип использования .attr() для установки вещей, а не .prop().

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

редактировать Чтобы уточнить, я не ищу:

  • различия между свойствами и атрибутами
  • различия между .attr() и .prop()
  • различия между использованием .attr() и .prop() для получения значений атрибутов или свойств

В противном случае мы могли бы просто пометить это как дубликат и положить этому конец :) Никакого оскорбления в отношении того, что было предложено до сих пор, просто хотелось дать понять, что я ищу информацию о том, что определяет, когда правильно использовать .attr() для установки значения атрибута, информацию о котором я не нашел в почтенной . prop() vs .attr() (хотя, если он есть, а я его пропустил, давайте обязательно отметим его как дубликат!) Спасибо!


javascript html jquery dom
person jinglesthula    schedule 19.09.2014    source источник
comment
Все можно найти здесь: stackoverflow.com/questions/5874652/prop-vs-attr   -  person daan.desmedt    schedule 19.09.2014
comment
@daan.desmedt это ссылка в вопросе, но да, я согласен, что это в значительной степени объясняет все   -  person Pete    schedule 19.09.2014
comment
@Pete Несмотря на это, он действительно правильно отвечает на вопрос ОП. Изменить: ваше редактирование покрыло это :)   -  person CodingIntrigue    schedule 19.09.2014
comment
Может пояснить еще кое-что: ejohn.org/blog/jquery-16-and-attr   -  person SSA    schedule 19.09.2014
comment
@daan.desmedt Я прочитал вопрос, на который вы ссылаетесь, а также множество ответов и комментариев. Причина, по которой я задал этот вопрос, заключается в том, что это единственное, что я искал, но не смог найти там :(. Если на это есть ответ, не могли бы вы предоставить ссылку на ответ (и/или комментарий), который охватывает этот аспект большой темы? Читал пока глаза не затуманились :)   -  person jinglesthula    schedule 19.09.2014
comment
@SSA Я только что перечитал пост еще раз (прошло некоторое время с тех пор, как я его читал), и я не вижу там ничего, что касалось бы этого конкретного аспекта attr/prop. Но я не стал перечитывать комментарии. Знаете ли вы кого-нибудь, кто дает понимание?   -  person jinglesthula    schedule 19.09.2014
comment
Вы действительно должны спрашивать только о вашем конкретном случае. Эти общие вопросы хорошо освещены в другом вопросе.   -  person Bergi    schedule 19.09.2014
comment
@Bergi Я действительно хочу понять задействованный принцип, чтобы принять правильное решение в моем конкретном случае и в других случаях в будущем. Я не вижу, где в другом вопросе рассматривается этот конкретный аспект темы. Если бы вы могли дать ссылку на ответ/комментарий, это было бы здорово. Я просто не заметил (там много текста и земли :)   -  person jinglesthula    schedule 19.09.2014
comment
Я думаю, что ответы TJCrowder и user1385191 довольно хорошо объясняют разницу между атрибутами и свойствами. То, что это означает для настройки, очень похоже на то, что это означает для получения.   -  person Bergi    schedule 19.09.2014
comment
Я должен извиниться за то, как я сформулировал вопрос. Пожалуйста, прочтите его внимательно — он специально не ищет разницы между свойствами и атрибутами.   -  person jinglesthula    schedule 19.09.2014
comment
Нашел это: jquery.com/upgrade-guide/1.9/#attr- vs-prop- Первые два предложения этого раздела безумно близки к ответу на вопрос. Но вся остальная часть раздела посвящена селекторам :( jquery.com/upgrade-guide/1.9/ также находится по соседству, но не дает того, чего хочет вопрос.   -  person jinglesthula    schedule 19.09.2014
comment
Я должен упомянуть, что ссылка на руководство по обновлению 1.9 отчасти сводит с ума, потому что в ней говорится, что использование .attr() для установки свойств устарело, но api.jquery.com/attr/#attr2 не имеет уведомления об устаревании при передаче значений для установки в .attr() в целом. Возможно, связанный с этим вопрос может заключаться в том, что использование изменения атрибута и оставление нетронутым связанного свойства? Иными словами, если .attr('foo', 'bar') имеет аспект "изменяющегося базового свойства", который является устаревшим, будет ли этот аспект удален в какой-то момент, и если да, то что такое .attr('foo', 'бар') для в этот момент?   -  person jinglesthula    schedule 19.09.2014

Ответы (2)


arrow_upward
1
arrow_downward

Из http://jq4you.blogspot.in/2013/04/jquery-attr-vs-prop-difference.html:

Jquery attr() и prop()

jQuery.attr()

Получить значение атрибута для первого элемента в наборе совпадающих элементов.

тогда как,

jQuery.prop()

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

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

Что такое атрибуты?

Атрибуты несут дополнительную информацию об элементе HTML и состоят из name=”value” пар. Вы можете установить атрибут для элемента HTML и определить его при написании исходного кода.

простой пример может быть:

<input id="test" type="test" value="test">
here, "type","value", "id" are attributes of the input elements.

Из .prop() vs .attr():

Обобщу основные вопросы:

  • Обычно вам нужна функция prop(), а не attr().

  • В большинстве случаев prop() делает то же, что и attr(). Замена вызовов attr() на prop() в вашем коде обычно
    работает.

  • Со свойствами обычно проще иметь дело, чем с атрибутами.
  • Значение атрибута может быть только строкой, тогда как свойство может быть любого типа. Например, проверенное свойство — это логическое значение, свойство стиля — это объект с индивидуальными свойствами для каждого стиля, свойство размера — это число.

  • Если существует и свойство, и атрибут с одинаковыми именами, обычно обновление одного приводит к обновлению другого, но это не относится
    к определенным атрибутам входных данных, таким как значение и проверено: для
    этих атрибутов свойство всегда представляет текущее состояние
    , в то время как атрибут (за исключением старых версий IE) соответствует значению/проверке ввода по умолчанию (отражено в свойстве defaultValue / defaultChecked).

  • Это изменение удаляет часть волшебного слоя jQuery, застрявшего перед атрибутами и свойствами, а это означает, что разработчикам jQuery придется немного узнать о разнице между свойствами и атрибутами. Это хорошая вещь.

Jsfiddle попробуйте сами

person Tushar    schedule 19.09.2014
comment
Спасибо. Я должен уточнить, что я хорошо знаком с информацией, приведенной в этом ответе. Вы включаете оператор, который вам обычно нужен, prop(), а не attr(). На самом деле возникает вопрос о том, когда использовать .attr(), а не .prop(), особенно при установке значений, а не при их получении. - person jinglesthula; 19.09.2014

arrow_upward
0
arrow_downward

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

<сильный>1. Используйте .attr() только тогда, когда

  • получение/установка атрибутов data-*
  • работа с парой атрибут/свойство, которая не является 1:1 (например, href для элемента привязки)

<сильный>2. Используйте .prop() во всех остальных случаях

<сильный>3. Кроме стоимости. Используйте .val(), чтобы получить/установить значение ввода.

  • Не используйте .attr('value')
  • Не используйте .attr('value', 'foo')
  • Не используйте .prop('value')
  • Не используйте .prop('value', 'foo')

Я думаю, что следуя этим правилам, ответ на вопрос о том, что происходит со свойствами, когда вы передаете значение в .attr(), в конечном итоге будет «кого это волнует?». И ответ на то, для чего .attr('foo', 'bar') был бы полезен, если бы устаревшее использование .attr() для установки значений свойств было удалено, в конечном итоге будет «установить/изменить атрибуты data-*».

Если кто-то еще может подумать о других случаях, когда использование .attr() было бы предпочтительнее использования .prop(), пожалуйста, отзовитесь.

person jinglesthula    schedule 20.10.2015