jQuery属性选择器.attr()和.prop()两种方法

mac2022-06-30  228

在判断表单单选框是否被选中时,通常会想到使用$('#checkbox').attr('checked')来判断,但在一些情况下,你会发现这种方法并不管用,得到的是undefined。

原来jQuery在1.6版本以后对属性选择器做了一些调整,分为.attr()和.prop()两种方法。为的是区分元素attributes和properties之间模棱两可的东西。

那么它们之间有什么区别呢?

官方的解释是:

Attributes vs. Properties

The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the .attr() method sometimes took property values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.

For example, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, and defaultSelected should be retrieved and set with the .prop() method. Prior to jQuery 1.6, these properties were retrievable with the .attr() method, but this was not within the scope of attr. These do not have corresponding attributes and are only properties.

其实也就是对DOM元素中的特性(attribute)和属性(property)做了明确的区分。

所以判断checkbox是否被选中,正确的方法应该是:

$('#checkbox').prop('checked'); // jQuery 1.6+ $('#checkbox').attr('checked'); // 在 1.6.1 和 <=1.5 中使用,但不包括 1.6 的版本 $('#checkbox').is(':checked'); // 所有版本 $("#ck:checked").length==1; // 所有版本

<参考:http://www.vipaq.com/Article/View/blog/356.html>

转载于:https://www.cnblogs.com/ChandlerVer5/p/jQuery_attr_prop.html


最新回复(0)