.prop（）与.attr（）

所以jQuery1.6有了新的函数prop（）。

$(selector).click(function(){
    //instead of:
    this.getAttribute('style');
    //do i use:
    $(this).prop('style');
    //or:
    $(this).attr('style');
})

或者在这种情况下，他们会做同样的事情吗？

如果我必须切换到使用prop（），那么如果我切换到1.6，所有旧的attr（）调用都会中断？

更新

选择器='#id'$（选择器）.click（函数）{//而不是：var getAtt=this.getAttribute（'style'）；//我是否使用：var thisProp=$（this）.prop（'style'）；//或：var thisAttr=$（this）.attr（“样式”）；console.log（getAtt、thisProp、thisAttr）；});<script src=“https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js“></script>测试</div>

（另请参见此小提琴：http://jsfiddle.net/maniator/JpUF2/)

控制台将getAttribute作为字符串记录，将attr作为字符串记录但将prop作为CSSStyleDeclaration记录，为什么？这对我未来的编码有何影响？

当前回答

肮脏的检查

该概念提供了一个可观察到差异的示例：http://www.w3.org/TR/html5/forms.html#concept-输入检查过脏

试试看：

单击按钮。两个复选框都被选中。取消选中这两个复选框。再次单击按钮。只有道具复选框被选中。砰！

$（'按钮'）.on（'单击'，函数（）{$（'#attr'）.attr（'checked'，'checked'）$（'#prop'）.prop（'checked'，true）})<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script><label>attr<input id=“attr”type=“checkbox”></label><label>prop<input id=“prop”type=“checkbox”></label><button type=“button”>设置选中的属性和属性</按钮>

对于某些属性，如按钮上的disabled，添加或删除content属性disabled=“disabled”总是切换属性（在HTML5中称为IDL属性），因为http://www.w3.org/TR/html5/forms.html#attr-fe残疾人说：

禁用的IDL属性必须反映禁用的内容属性。

所以你可以摆脱它，尽管它很难看，因为它不需要修改HTML。

对于其他属性，如inputtype=“checkbox”上的checked=“checked”，事情就会中断，因为一旦单击它，它就会变脏，然后添加或删除checked=”checked“内容属性将不再切换checked。

这就是为什么应该主要使用.prop，因为它直接影响有效属性，而不是依赖于修改HTML的复杂副作用。

2014-07-06 11:43:32

其他回答

.attr（）：

获取匹配元素集合中第一个元素的属性值。为您提供页面加载时html中定义的元素值

.prop（）：

获取匹配元素集合中第一个元素的属性值。提供通过javascript/jquery修改的元素的更新值

2015-12-08 09:14:49

属性在HTML文本文档/文件中（==想象这是解析HTML标记的结果），而财产位于HTMLDOM树中（==基本上是JS意义上某个对象的实际属性）。

重要的是，其中许多都是同步的（如果您更新了class属性，那么html中的class属性也将被更新；否则）。但某些属性可能会与意外的财产同步，例如，checked属性对应于defaultChecked属性，以便

手动选中复选框将更改.prop（'checked'）值，但不会更改.attr（'checked）和.prop（'defaultChecked'）的值设置$（'#input'）.prop（'defaultChecked'，true）也将更改.attr（'checked'），但这在元素上不可见。

经验法则是：.prop（）方法应该用于布尔属性/财产和html中不存在的财产（例如window.location）。所有其他属性（您可以在html）可以并且应该继续使用.attr（）操作方法(http://blog.jquery.com/2011/05/10/jquery-1-6-1-rc-1-released/)

这里有一个表显示了.prop（）的首选位置（尽管.attr（）仍然可以使用）。

为什么您有时会想使用.prop（）而不是.attr（），后者是官方推荐的？

.prop（）可以返回任何类型-string、integer、boolean；而.attr（）始终返回字符串。.prop（）据说比.attr（）快2.5倍。

2015-06-12 05:56:56

在prop（）与attr（）中，几乎没有其他注意事项：

selectedIndex、tagName、nodeName、nodeType、ownerDocument、defaultChecked和defaultSelected。。应使用.prop（）方法检索和设置。这些属性没有相应的属性，只是财产。输入类型复选框.attr（'checked'）//返回已检查.prop（'checked'）//返回true.is（“：checked”）//返回trueprop方法返回选中、选中、禁用或禁用的布尔值，只读。。而attr返回定义的字符串。所以，你可以直接在if条件下使用.prop（'checked'）。.attr（）在内部调用.prop（），因此.attr比直接通过.prop（）访问它们慢。

2020-05-14 16:58:16

DOM中有一个属性；属性在HTML中，该HTML被解析为DOM。

进一步的细节

如果更改属性，则更改将反映在DOM中（有时使用不同的名称）。

示例：更改标记的class属性将更改DOM中该标记的className属性（这是因为类已被使用）。如果标记上没有属性，那么相应的DOM属性仍然为空或默认值。

示例：虽然标记没有class属性，但DOM属性className确实存在空字符串值。

edit

如果您更改一个，另一个将由控制器更改，反之亦然。该控制器不在jQuery中，而是在浏览器的本地代码中。

2011-09-27 16:55:09

属性->HTML

财产->DOM

2014-12-26 13:28:55