最近开发中发现用attr无法设置checkbox的选中事件,在网上找了下说要用prop,所以总结下两者的区别。

1、操作的对象不同

  attr:操作的是HTML文档节点属性

  prop:操作的是js对象属性

2、应用版本不同

  attr()是jQuery 1.0版本就有的函数,prop()是jQuery 1.6版本新增的函数。

  在1.6之前,只能使用attr()函数;1.6及以后版本,你可以根据实际需要选择对应的函数。

3、用于设置的属性值类型不同

  由于attr()函数操作的是文档节点的属性,因此设置的属性值只能是字符串类型,如果不是字符串类型,也会调用其toString()方法,将其转为字符串类型。

  prop()函数操作的是JS对象的属性,因此设置的属性值可以为包括数组和对象在内的任意类型。

4、其他

  使用attr()获取这些属性的返回值为String类型,如果被选中(或禁用)就返回checkedselecteddisabled,否则(即元素节点没有该属性)返回undefined

  并且,在某些版本中,这些属性值表示文档加载时的初始状态值,即使之后更改了这些元素的选中(或禁用)状态,对应的属性值也不会发生改变。

  因为jQuery认为:attribute的checkedselecteddisabled就是表示该属性初始状态的值,

  property的checkedselecteddisabled才表示该属性实时状态的值(值为truefalse)。

因此,在jQuery 1.6及以后版本中,请使用prop()函数来设置或获取checkedselecteddisabled等属性。对于其它能够用prop()实现的操作,也尽量使用prop()函数。

jquery attr与prop的区别与联系的更多相关文章

  1. [jQuery]attr和prop的区别

    转自:http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html 在高版本的jquery引入prop方法后,什么时候 ...

  2. 稳固而窒息 jquery attr 和 Prop的区别

    通常在获取或者设置checked,selected,readonly,disabled等的时候使用prop效果更好 attr是通过setAtrribute和getAttribute来设置的,使用的是D ...

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

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

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

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

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

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

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

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

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

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

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

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

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

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

随机推荐

  1. ubuntu14.04 编译安装CPU版caffe

      本文,试图中一个干净的ubuntu14.04机器上安装caffe的cpu版本. http://blog.csdn.net/sinat_35188997/article/details/735304 ...

  2. Python 模块之 time & datetime

    Python 中提供了对时间日期的多种多样的处理方式,主要是在有 time 和 datetime 两个模块. time 在 Python 文档里,time 是归类在 Generic Operating ...

  3. C#笔试面试宝典值得收藏

    又是一年换工作纠结的季节,前一阵子由于工作的缘故,薪资降低,加之被其他部门以莫须有的罪名投诉:固然愤慨之,遂升起离职念想,下面是这几天电话面试和笔试中常问到的问题汇总,给大家分享下,不足之处往大神拍砖 ...

  4. HBA 卡和RAID 卡

    HBA卡: 只从HBA的英文解释HOST BUS ADAPTER(主机总线适配器)就能看出来,他肯定是给主机用的,一般HBA就是给主机插上后,给主机扩展出更多的接口,来连接外部的设备.大多数讲到HBA ...

  5. SQL基础三

    一.SQL ORDER BY 子句 ORDER BY 语句用于对结果集进行排序,默认按照升序对记录进行排序,如果需要按照降序进行排序,需要在后面追加关键字DESC.应用如下: 原始的表:Orders表 ...

  6. mysql 练习题(Day44)

    init.sql文件内容 /* 数据导入: Navicat Premium Data Transfer Source Server : localhost Source Server Type : M ...

  7. s5_day4作业

    # #流程控制练习题: # #==========>基础部分 # #练习一: # if True or False and False: # print('yes') # else: # pri ...

  8. hadoop08---读写锁

    ReentrantLock 直接使用lock接口的话,我们需要实现很多方法,不太方便,ReentrantLock是唯一实现了Lock接口的类,并且ReentrantLock提供了更多的方法,Reen ...

  9. JavaWeb HTTP

    1. Http协议 1.1. 什么是Http协议 Http的全称为HyperText Transfer Protocol,译为超文本传输协议,是一种详细规定了浏览器和万维网服务器之间互相通信的规则,通 ...

  10. 判断当前html是否在微信中打开

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...