在高版本的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的区别)的更多相关文章

  1. jQuery知识点:attr与prop的区别

    做项目时遇到个莫名的问题,全选的时候仅第一次有效,再次点击全选按钮是无效了,查了查原因,看到篇很不错的文章,问题出在jquery中的attr属性上,这里做下笔记. 原文链接:http://www.cn ...

  2. jquery中的attr与prop的区别,什么时候用attr,什么时候用prop

    只要有 Boolean() 属性的,简单说就是具有true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),(其实这些都是表单类的), ...

  3. Jquery学习笔记: attr和 prop的区别,以及为html标签自定义属性

    一.自定义html标签属性 对于html文件中的html标签,可以自定义属性,如: <a href="#" id="link1" action=" ...

  4. jQuery中.attr()和.prop()的区别

    之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...

  5. tips:Jquery的attr和prop的区别

    Jquery的attr和prop的区别 描述:想做一个复选框checkbox全选的功能,当勾选全选后,将子项的复选框状态设置成一致的, 但遇到了一个问题,就是attr函数并不能改变子项的checkbo ...

  6. jquery中attr和prop的区别、 什么时候用 attr 什么时候用 prop (转自 芈老头 )

    jquery中attr和prop的区别. 什么时候用 attr 什么时候用 prop   在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这 ...

  7. 【jQuery 区别】attr()和prop()的区别

    1>>> 今天实现一个 点击更新按钮 ,可以勾选上本行的的checkbox的功能: 使用代码: /** * updateproduct.htmls 更新 产品信息 */ $(docu ...

  8. jquery中attr和prop的区别(转)

    在网络上看到这样一篇关于jquery中attr和prop的区别文章,觉得不错,所以转载了. 在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined.如果你要 ...

  9. jquery中attr和prop的区别分析

    这篇文章主要介绍了jquery中attr和prop的区别分析的相关资料,需要的朋友可以参考下 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别 ...

  10. Jquery学习笔记(6)--jquery中attr和prop的区别【精辟】

    jquery中attr和prop的区别 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很 ...

随机推荐

  1. (转) 学习C++ -> 向量(vector)

      vector是向量类型,它是一种对象实体,具有值,所以可以看作是变量. 它可以容纳许多其他类型的相同实体,如若干个整数,所以称其为容器.   vector类与一般的Array类的区别在于:   1 ...

  2. uva11630 or hdu2987 Cyclic antimonotonic permutations(构造水题)

    转载请注明出处: http://www.cnblogs.com/fraud/          ——by fraud Cyclic antimonotonic permutations Time Li ...

  3. bzoj 2049 Cave 洞穴勘测(LCT)

    转载请注明出处: http://www.cnblogs.com/fraud/          ——by fraud 动态树入门题,不需要维护任何信息. 我用的是splay,下标实现的lct. #in ...

  4. a^b的前n位数

    假设我们现在需要知道 ab  的后 n 位数或前 n 位数,简单直观的做法就是求出 ab  的值,然后在分别取前 n位或后 n位,不过在 a,b很大的情况下显然是无法存储的.所以,直接求是不可能的了. ...

  5. 使用Promise规定来处理ajax请求的结果

    ajax()返回结果是成功的,调用done()中的回调函数: 失败则调用fail()中的回调函数; always()的回调函数不管成功是否都会调用: 可以是使用then()函数代替done()和fai ...

  6. 记录一下C#+Oracle批量插入的一个方法

    public bool insertOracle(DataTable dataTable, string sql) // Oracle sql 查询的是表头 { string ConnStr = Wi ...

  7. javascript 数组学习(一)

    今天学习了一下<javascript权威指南(第6版)>的第七章:数组 一.数组的创建: 数组的创建有3种方法: var colors = new Array(3);//可以省略new v ...

  8. mysql之6备份恢复

    基本意义: 将数据另存到其他设备,以便于出现问题时恢复数据     为什么要备份: 灾难恢复:需求改变:测试     几个事先需要考虑的问题: 可以容忍丢失多长时间的数据?恢复要在多长时间内完成?是否 ...

  9. ASP.NET用户自定义控件配置

    一直以来开发中碰到要写自定义控件的时候总是习惯性的找度娘,而没有自己记住,结果今天就悲剧了,找了半天才找到,想想还是自己积累起来吧! 第一种配置方式: 配置写在webconfig文件中,位置如下: w ...

  10. linux系统文件夹的作用 good

    /bin 二进制可执行命令 /dev 设备特殊文件 /etc 系统管理和配置文件 如:环境变量 /etc/rc.d 启动的配置文件和脚本 /home用户主目录的基点,比如用户user的主目录就是/ho ...