Question

注意，这不是.prop() vs .attr()的副本;该问题涉及prop vs attr的基本功能，而这个问题特定于他们作为制定者的差异。

在尝试使用.prop（）缩小应该设置的内容时，与创建新元素时应通过.attr（）设置的内容相比，在jQuery 1.7.2的测试中，我发现prop是约2.5倍更快，所以看起来更好。

使用attr设置的唯一列表我可以找到attr：

accesskey，align，background，bgcolor，class，contenteditable，contextmenu，data-XXXX，draggable，height，hidden，id，item，itemprop，spellcheck，style，subject，tabindex，title，valign，width

这是完整的（即，不在该列表中的任何内容 - 例如min，max，step等 - 应该使用prop）？
在测试中，其中一些似乎在使用prop设置时工作正常。测试上面的列表，我在使用prop设置以下内容时没有任何问题：

id，class，align，contenteditable，draggable，hidden，spellcheck，tabindex，title
是否有某些原因，对于那些“设置attr仍然可以在使用prop设置时工作的东西”的列表，为什么它仍然应该用attr设置？如果没有，那么在创建基本<div id="foo" class="bar" draggable="true" title="zipzap">时性能提高250％对我来说似乎很好......：）

Answer 1

我在网上找不到任何完整的清单。提供任何类型列表的每个人都只复制jQuery 1.6博客文章中给出的部分列表。关于＃3，Starx在他的评论中解决了这个问题。通过体面的讨论，http://timmywillison.com/会更加详细。 MDN和W3C规范还提到了属性中有各种接口，可以将它们设置为属性（https://developer.mozilla.org/en/DOM/element），尽管MDN实际上并没有列出那些属性。 MDN确实提到使用属性接口作为setter比使用getAttribute更脆弱：

＆＃34;虽然这些接口通常由大多数HTML和XML元素共享，但DOM HTML规范中列出的特定对象有更多专用接口。但请注意，这些HTML界面仅适用于[HTML 4.01]和[XHTML 1.0]文档，并且不保证可以与任何未来版本的XHTML一起使用。＆＃34; HTML 5草案确实说明它的目的是向后兼容这些HTML界面，但是说它们已经删除了以前弃用，支持不足，很少使用或被认为不必要的一些功能。＆＃34;可以通过完全移动到DOM XML属性方法（例如getAttribute（））来避免潜在的冲突。＆＃34;

但是，现在似乎可以安全地假设在Firefox和Chrome中呈现的任何HTML5文档类型页面已经处于不推荐使用，支持不良等等已经删除的环境中。

因此，我使用boolean，string和int值测试了每个HTML元素类型的每个属性以及jQuery博客中提到的非属性属性。

使用1.7.2和1.8pre，无论你调用.prop（）还是attr（），jQuery都会在内部总是实际使用.prop：

async, autofocus, autoplay, checked, controls, defer, disabled, hidden, loop,
multiple, open, readonly, required, scoped, selected

对于HTML元素（此处不考虑窗口，文档等），除非使用.attr（），否则jQuery不会设置以下任何属性：

accept-charset, accesskey, bgcolor, buffered, codebase, contextmenu, datetime,
default, dirname, dropzone, form, http-equiv, icon, ismap, itemprop, kind, 
language, list, location, manifest, nodeName, nodeType, novalidate, pubdate, 
radiogroup, seamless, selectedIndex, sizes, srclang, style, tagName

最后，jQuery将使用.prop（）或.attr（）设置以下属性列表。在上面的第一个列表中，无论您使用.attr（）还是.prop（），jQuery总是使用.prop（）。对于此列表中的属性，jQuery使用您使用的任何内容。如果使用.prop（），则jQuery使用.prop（），反之亦然。在任何一种情况下，结果都是一样的。所以忽略任何潜在的语义考虑，只是关于prop（）比.attr（）快2.5倍，jQuery 1.6.1博客文章建议使用.attr（），但可以使用.prop（），性能显着提高：

accept, action, align, alt, autocomplete, border, challenge, charset, cite, 
class, code, color, cols, colspan, contenteditable, coords, data, defaultValue, 
dir, draggable, enctype, for, headers, height, hidden, high, href, hreflang, 
id, keytype, label, lang, low, max, maxlength, media, method, min, name, 
optimum, pattern, ping, placeholder, poster, preload, readonly, rel, required, 
reversed, rows, rowspan, sandbox, scope, shape, size, span, spellcheck, src, 
srcdoc, start, step, summary, tabindex, target, title, type, usemap, value, 
width, wrap

Answer 2

尝试以简单的术语理解这一点。

.attr()给出了元素的属性。该属性在页面上加载时。

.prop()，给出元素的属性

这可以是元素的状态，就像复选框一样，可以选中或取消选中它。
或者，它可以是元素的修改属性，因为默认状态。

此question包含您需要了解的所有差异。通常，在使用DOM操作部件时，您需要属性而不是属性。 T.J的answer真的清除了这个概念。

jQuery：prop vs attr ...澄清

2 个答案: