什么时候最好使用`attr()`而不是`.prop()`? [英] When is it preferable to use `attr()` instead of `.prop()`?

问题描述

(注意:虽然很可能会说这是的副本. prop()vs .attr()，我不相信这是那篇文章做得很好，解释了.prop()和.attr()之间的区别，但是并没有明确说明何时一个人比另一个人更可取，这是这个问题的目的.)

尽管已经阅读了关于Stackcoverflow关于.prop()和.attr()之间差异的许多问题/答案，但我仍然在这个问题上感到很多困惑.

我认为有必要在StackOverflow上使用明确的参考来描述何时一种方法优于另一种方法，这样我们就可以消除猜测，并尝试找出某物是属性还是属性./p>

因此，我问，最好使用.prop()的哪个属性/属性，以及.attr() 的哪个?

解决方案

适用于之前 jQuery 1.9

下面是一些属性和属性的列表，在获取或设置它们时通常应使用哪种方法.这是首选用法，但.attr()方法将在所有情况下均适用.

+------------------------------------+------------+-----------+
| Attribute/Property                 |  .attr()   |  .prop()  |
+------------------------------------+------------+-----------+
| accesskey                          |    ✓       |           |
| align                              |    ✓       |           |
| async                              |            |    ✓      |
| autofocus                          |            |    ✓      |
| checked                            |            |    ✓      |
| class                              |    ✓       |           |
| contenteditable                    |    ✓       |           |
| disabled                           |            |    ✓      |
| draggable                          |    ✓       |           |
| href                               |    ✓       |           |
| id                                 |    ✓       |           |
| label                              |    ✓       |           |
| location (i.e., window.location)   |            |    ✓      |
| multiple                           |            |    ✓      |
| readOnly                           |            |    ✓      |
| rel                                |    ✓       |           |
| selected                           |            |    ✓      |
| src                                |    ✓       |           |
| tabindex                           |    ✓       |           |
| title                              |    ✓       |           |
| type                               |    ✓       |           |
| width (if needed over .width())    |    ✓       |           |
+------------------------------------+------------+-----------+

.attr()和.prop()都不应该用于获取/设置值.请改用.val()方法(尽管可以使用.attr(value, somevalue).

摘要::.prop()方法应用于布尔属性/属性以及html中不存在的属性(例如window.location).所有其他属性(可以在html中看到的属性)都可以并且应该继续使用.attr()方法进行处理.

参考

(Note: While it may be tempting to say this is a duplicate of .prop() vs .attr(), I do not believe it is. That post does a fantastic job explaining the difference between .prop() and .attr() but does not state definitively when one is preferable over the other, which is what this question aims to do.)

Despite having read a number of questions/answers on StackOverflow regarding the differences between .prop() and .attr(), I still see a lot of confusion on this issue.

I feel it would be useful to have a definitive reference on StackOverflow delineating when one method is preferable to the other, so that we can eliminate the guesswork and attempts at trying to figure out whether something is an attribute or a property.

Thus, I ask, for which attributes/properties is it preferable to use .prop() and for which .attr()?

解决方案

Applicable before jQuery 1.9

Below is a list of some attributes and properties and which method should normally be used when getting or setting them. This is the preferred usage, but the .attr() method will work in all cases.

+------------------------------------+------------+-----------+
| Attribute/Property                 |  .attr()   |  .prop()  |
+------------------------------------+------------+-----------+
| accesskey                          |    ✓       |           |
| align                              |    ✓       |           |
| async                              |            |    ✓      |
| autofocus                          |            |    ✓      |
| checked                            |            |    ✓      |
| class                              |    ✓       |           |
| contenteditable                    |    ✓       |           |
| disabled                           |            |    ✓      |
| draggable                          |    ✓       |           |
| href                               |    ✓       |           |
| id                                 |    ✓       |           |
| label                              |    ✓       |           |
| location (i.e., window.location)   |            |    ✓      |
| multiple                           |            |    ✓      |
| readOnly                           |            |    ✓      |
| rel                                |    ✓       |           |
| selected                           |            |    ✓      |
| src                                |    ✓       |           |
| tabindex                           |    ✓       |           |
| title                              |    ✓       |           |
| type                               |    ✓       |           |
| width (if needed over .width())    |    ✓       |           |
+------------------------------------+------------+-----------+

Neither .attr() nor .prop() should be used for getting/setting value. Use the .val() method instead (although using .attr("value", "somevalue") will work.

Summary: The .prop() method should be used for boolean attributes/properties and for properties which do not exist in html (such as window.location). All other attributes (ones you can see in the html) can and should continue to be manipulated with the .attr() method.

Reference

这篇关于什么时候最好使用`attr()`而不是`.prop()`?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！