Question

我在某些地方看到.attr（）用于jQuery。在某些地方使用.prop（）。但是我搜索过在SO和谷歌我很困惑。请告诉我两者之间的确切区别这两个以及何时使用它们。

我看过以下链接 jQuery attr vs. prop, there are a list of props? jQuery attr vs prop?

但我没有得到答案。请帮帮我。谢谢。

在给出downvote之前请解释原因，然后我会在下一篇文章中更正。

Answer 1

来自docs

在特定情况下，属性和属性之间的差异非常重要。在jQuery 1.6之前，.attr（）方法在检索某些属性时有时会考虑属性值，这可能会导致行为不一致。从jQuery 1.6开始，.prop（）方法提供了一种显式检索属性值的方法，而.attr（）则检索属性。

例如

例如，应检索selectedIndex，tagName，nodeName，nodeType，ownerDocument，defaultChecked和defaultSelected，并使用.prop（）方法进行设置。在jQuery 1.6之前，这些属性可以使用.attr（）方法检索，但这不在attr的范围内。它们没有相应的属性，只是属性。

评论后

更新

您可以为HTML元素设置属性。您在编写源代码时定义它，一旦浏览器解析您的代码，将创建相应的DOM节点，这是一个具有属性的对象。

简单的例子可以是......

<input type="test" value="test" id="test" />

此处类型，值，ID 是属性。一旦浏览器呈现它，您将获得其他属性，如对齐，alt，自动对焦，baseURI，已检查等。

link如果您想了解更多内容

Answer 2

.attr()更改了该HTML标记的属性。

.prop()根据DOM树更改该HTML标记的属性。

正如此链接中的示例所示。输入字段可以具有属性“value”。这将等于您输入的默认值。如果用户更改输入字段中的值，则DOM树中的属性“value”会更改，但原始属性将保留。

基本上，如果您希望为HTML标记的属性设置默认值，请使用.attr()函数。如果用户可以更改该值（例如输入，复选框，无线电等），请使用.prop()功能获取最新值。

参考： HTML: The difference between attribute and property

示例代码段

$(document).ready(function() {
  console.log($('#test').attr('value') + " - With .attr()");

  $('#answer').click(function() {
    console.log($('#test').attr('value') + " - With .attr()");
    console.log($('#test').prop('value') + " - With .prop()");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>Change the input value and check the console...</div>
<input type="text" id="test" value="Sample">
<button id="answer">Click Me</button>

Answer 3

JQuery是一个不断变化的库，有时他们会定期进行改进。 .attr（）用于从HTML标记中获取属性，虽然它是完美的功能。后来添加了.prop（）更具语义性，并且它更适用于“已检查”和“已选择”等无值属性。 / p>

建议如果您使用的是更高版本的JQuery，则应尽可能使用.prop（）。

jQuery中prop（）和attr（）之间的区别以及何时使用attr（）和prop（）

3 个答案: