jquery中attr和prop的区别

╰半夏微凉° 2022-04-15 02:45 233阅读 0赞

# [jquery中attr和prop的区别][jquery_attr_prop] #

在高版本的jquery引入prop方法后，什么时候该用prop？什么时候用attr？它们两个之间有什么区别？这些问题就出现了。

关于它们两个的区别，网上的答案很多。这里谈谈我的心得，我的心得很简单：

*  对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
 *  对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。

上面的描述也许有点模糊，举几个例子就知道了。

<a href="http://www.baidu.com" target="_self" class="btn">百度</a>

这个例子里<a>元素的DOM属性有“href、target和class"，这些属性就是<a>元素本身就带有的属性，也是W3C标准里就包含有这几个属性，或者说在IDE里能够智能提示出的属性，这些就叫做固有属性。处理这些属性时，建议使用prop方法。

<a href="#" id="link1" action="delete">删除</a>

这个例子里<a>元素的DOM属性有“href、id和action”，很明显，前两个是固有属性，而后面一个“action”属性是我们自己自定义上去的，<a>元素本身是没有这个属性的。这种就是自定义的DOM属性。处理这些属性时，建议使用attr方法。使用prop方法取值和设置属性值时，都会返回undefined值。

再举一个例子：

<input id="chk1" type="checkbox" />是否可见
    <input id="chk2" type="checkbox" checked="checked" />是否可见

像checkbox，radio和select这样的元素，选中属性对应“checked”和“selected”，这些也属于固有属性，因此需要使用prop方法去操作才能获得正确的结果。

$("#chk1").prop("checked") == false
    $("#chk2").prop("checked") == true

如果上面使用attr方法，则会出现：

$("#chk1").attr("checked") == undefined
    $("#chk2").attr("checked") == "checked"

[jquery_attr_prop]: https://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html

发表评论取消回复

表情：

评论列表（有 0 条评论，233人围观）

还没有评论，来说两句吧...

相关阅读

相关 jquery中attr和prop的区别

在高版本的jquery引入prop方法后，什么时候该用prop？什么时候用attr？它们两个之间有什么区别？这些问题就出现了。关于它们两个的区别，网上的答案很多。这里谈谈我

Dear 丶/ 2022年08月17日 15:27/ 0 赞/ 179 阅读

相关 jquery中attr和prop的区别

[jquery中attr和prop的区别][jquery_attr_prop] 在高版本的jquery引入prop方法后，什么时候该用prop？什么时候用attr？它们两

蔚落/ 2022年07月13日 09:59/ 0 赞/ 197 阅读

相关 jQuery中prop 和 attr 区别

prop() 方法是在jquery1.6中新添加的。我们知道 attr(“checked”)获取checkbox的checked属性时选中的时候可以取到值,值为”checked

- 日理万妓/ 2022年06月11日 01:53/ 0 赞/ 277 阅读

相关 jquery中的attr()和prop()的区别

jquery中的attr()和prop()的区别通过prop方法获取checked属性，获取的checked返回值为boolean，选中为true,否则为flas

我会带着你远行/ 2022年06月10日 00:09/ 0 赞/ 229 阅读

相关 jquery 中的prop和attr的区别

今天在使用attr的时候，例如我想使用attr为input设置checked，但是我发现当我点击按钮，进过设置为true和false之后，再点击的时候，虽然设置了check

你的名字/ 2022年06月01日 00:25/ 0 赞/ 229 阅读

相关 jQuery中的attr()和prop()的区别

先看个简单的例子： HTML代码 <div id="container"> <p>喜欢的水果</p> <input type="checkbox" class="c

爱被打了一巴掌/ 2022年05月25日 21:15/ 0 赞/ 200 阅读

相关 jquery中attr和prop的区别

[jquery中attr和prop的区别][jquery_attr_prop] 在高版本的jquery引入prop方法后，什么时候该用prop？什么时候用attr？它们两

╰半夏微凉°/ 2022年04月15日 02:45/ 0 赞/ 234 阅读

相关 jQuery prop和attr的区别

两者对比 <table> <tbody> <tr> <td>jquery方法</td> <td>原理</td> <td>适合场景

比眉伴天荒/ 2021年12月20日 16:41/ 0 赞/ 302 阅读

相关 jQuery中attr和prop的区别

在平时的使用jQuery的过程中，对于.attr()和.prop()，总是有时候取不出值来，有时候就是一个取不出来就换一试试，有点影响开发效率，所以对于prop()和attr(

我会带着你远行/ 2021年09月16日 12:11/ 0 赞/ 415 阅读

相关 jquery中prop和attr的区别

jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) 概述

曾经终败给现在/ 2021年09月10日 23:44/ 0 赞/ 392 阅读