何时使用 .attr() 设置/更改属性值合适？答案

【问题标题】：When is use of .attr() to set/change attribute values appropriate?何时使用 .attr() 设置/更改属性值合适？
【发布时间】：2014-09-19 14:21:50
【问题描述】：

请花时间阅读完整的问题，然后再假设它与.prop() vs .attr()重复

我已经阅读了.prop() vs .attr() 以及一些重复和相关的非重复。我的问题是：在处理 HTML 和 DOM 时，将值传递给 .attr() 什么时候合适？

当然，简单的答案是“为什么，只要您希望设置或修改属性的值 - 否则（通常）使用 .prop()。”

但我真正想知道的是你应该什么时候想。在该方法的 jQuery 文档中，我看到了在 img 元素上设置 id、src、alt 和 title 等内容的示例。但是文档似乎没有说明您为什么要这样做，而不是使用 .prop() 来设置这些特定属性。

我追求的是何时使用 .attr() 而不是 .prop() 来设置的指导原则。

相关说明：我正在处理的特定案例是更改表单操作的正确方法，但我真的想要决策背后的观点和理解。

编辑为了澄清，我不是在寻找：

属性和属性的区别
.attr() 和 .prop() 的区别
使用 .attr() 和 .prop() 来获取属性或属性值的区别

否则，我们可以将其标记为重复并结束 :) 没有任何冒犯到目前为止所提供的内容的意图 - 只是想明确表示我正在寻找关于什么决定何时使用 .attr() 来设置属性值的信息，我在可敬的 .prop() vs .attr() 上没有找到该信息（尽管如果它在那里并且我错过了它，让我们绝对将其标记为重复！）谢谢！

【问题讨论】：

一切都可以在这里找到：stackoverflow.com/questions/5874652/prop-vs-attr
@daan.desmedt 这是问题中的链接，但是我同意它几乎可以解释一切
@Pete 即便如此，它确实恰当地回答了 OP 的问题。编辑：您的编辑涵盖了:)
可能会解释一些更多的事情：ejohn.org/blog/jquery-16-and-attr
@daan.desmedt 我已经阅读了您引用的问题以及那里的许多答案和 cmets。我问这个问题的原因是因为这是我一直在寻找的一件事，但我在那里找不到:(。如果在那里回答了这个问题，您能否提供一个链接，指向涵盖这方面的答案（和/或评论）更大的话题？我读到我的眼睛都模糊了:)

标签： javascript jquery html dom

【解决方案1】：

来自http://jq4you.blogspot.in/2013/04/jquery-attr-vs-prop-difference.html：

Jquery attr() vs 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() 以前的操作。在您的代码中用 prop() 替换对 attr() 的调用通常会
工作。

属性通常比属性更容易处理。

属性值只能是字符串，而属性可以是任何类型。例如，checked 属性是一个布尔值， style 属性是一个对象，每个对象都有单独的属性样式，size 属性是一个数字。

如果同时存在同名的属性和属性，通常更新一个会更新另一个，但情况并非如此
对于输入的某些属性，例如值和检查：for
这些属性，属性总是代表当前状态
而属性（旧版本的 IE 除外）对应于输入的默认值/检查性（反映在 defaultValue /defaultChecked 属性）。

这个改动去掉了 jQuery 卡在属性和属性前面的一些魔法层，意味着 jQuery 开发者将必须了解一下属性和属性之间的区别属性。这是一件好事。

Jsfiddle自己试试

【讨论】：

谢谢。我应该澄清一下，我对这个答案中给出的信息非常熟悉。您包括声明“您通常需要 prop() 而不是 attr()”。这个问题真正要问的是何时使用 .attr() 而不是 .prop()，特别是在设置值而不是获取时。

【解决方案2】：

经过大量阅读和重新阅读，我认为答案是这样的。（与其尝试仅提取适用于原始问题的部分内容，我认为为上下文提供全套“规则”是有意义的。）

1.仅在

时使用.attr()

获取/设置数据-* 属性
使用非 1:1 的属性/属性对（例如锚元素上的 href）

2。在所有其他情况下使用.prop()

3.除了价值。使用.val() 获取/设置输入值。

不要使用 .attr('value')
不要使用 .attr('value', 'foo')
不要使用 .prop('value')
不要使用 .prop('value', 'foo')

我认为通过遵循这些规则，当您将值传递给 .attr() 时属性会发生什么问题的答案最终会成为“谁在乎？”。如果现在不推荐使用.attr() 来设置属性值，那么.attr('foo', 'bar') 的答案将有助于“设置/修改数据-* 属性”。

如果其他人在使用.attr() 时能想到其他情况，会比使用.prop() 更好，请加入。

【讨论】：