jQuery中attr()和prop()在修改checked属性时的区别


Posted in Javascript onJuly 18, 2014

在做复选框全选按钮的时候,出现了一个问题,使用语句$.attr('checked',true),将复选框的属性改为被选中,在chrome浏览器中第一次点击有效后面就不行了,IE8倒是没有问题。

百度了很久找到原因是HTML的属性分为attribute和property,暂且将后者称为特性。

checked属性即分为attribute->checked,和property->true,false。

对于一个checkbox,若未定义checked="checked",alert($.attr("checked")) 的结果是undefined。若已定义则结果是checked。attribute并不随着checkbox的状态变化而改变。

使用prop($.attr("checked"))的话输出则分别为false和true。property则随其变化而变化。

所以在修改checked属性时要使用prop()。prop()在jQuery1.6版本后新增。

网上关于其他类似属性的图表:
jQuery中attr()和prop()在修改checked属性时的区别

另外关于在IE9之前版本中,如果property没有在DOM元素被移除之前删除,使用.prop()方法设置DOM元素property(简单类型除外:number、string、boolean)的值会导致内存泄露。为了安全的设置DOM对象的值,避免内存泄露,可以使用.data()方法。 目前尚未遇到,先记在这里。

Javascript 相关文章推荐
JQuery 表单中textarea字数限制实现代码
Dec 07 Javascript
javascritp添加url参数将参数加入到url中
Sep 25 Javascript
JS在可编辑的div中的光标位置插入内容的方法
Nov 20 Javascript
javascript弹出页面回传值的方法
Jan 28 Javascript
原生js实现鼠标跟随效果
Feb 28 Javascript
CSS3+JavaScript实现翻页幻灯片效果
Jun 28 Javascript
史上最全JavaScript数组去重的十种方法(推荐)
Aug 17 Javascript
layui table 复选框跳页后再回来保持原来选中的状态示例
Oct 26 Javascript
JS实现简单省市二级联动
Nov 27 Javascript
高性能js数组去重(12种方法,史上最全)
Dec 21 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
Jun 12 Javascript
vue项目实现减少app.js和vender.js的体积操作
Nov 12 Javascript
$.each遍历对象、数组的属性值并进行处理
Jul 18 #Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
Jul 17 #Javascript
一个小例子解释如何来阻止Jquery事件冒泡
Jul 17 #Javascript
iframe调用父页面函数示例详解
Jul 17 #Javascript
js中一维数组和二位数组中的几个问题示例说明
Jul 17 #Javascript
js中函数调用的两种常用方法使用介绍
Jul 17 #Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
Jul 17 #Javascript
You might like
解析php curl_setopt 函数的相关应用及介绍
2013/06/17 PHP
php恢复数组的key为数字序列的方法
2015/04/28 PHP
今天你说520了吗?不仅有php表白书还有java表白神器
2016/05/20 PHP
php文件系统处理方法小结
2016/05/23 PHP
PHP使用JpGraph绘制折线图操作示例【附源码下载】
2019/10/18 PHP
Jquery 获得服务器控件值的方法小结
2010/05/11 Javascript
JS完成代码前最好对其做5件事
2013/04/07 Javascript
jquery中toggle函数交替使用问题
2015/06/22 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
2015/08/10 Javascript
CSS或者JS实现鼠标悬停显示另一元素
2016/01/22 Javascript
谈一谈js中的执行环境及作用域
2016/03/30 Javascript
JavaScript数据类型转换的注意事项
2016/07/31 Javascript
jQuery EasyUI datagrid在翻页以后仍能记录被选中行的实现代码
2016/08/15 Javascript
Angularjs+bootstrap+table多选(全选)支持单击行选中实现编辑、删除功能
2017/03/27 Javascript
JavaScript ES6中const、let与var的对比详解
2017/06/18 Javascript
基于angular2 的 http服务封装的实例代码
2017/06/29 Javascript
javascript如何用递归写一个简单的树形结构示例
2017/09/06 Javascript
JavaScript监听触摸事件代码实例
2019/12/30 Javascript
[05:03]显微镜下的DOTA2第十期——Ti3豪之超神幽鬼
2014/06/23 DOTA
[55:11]完美世界DOTA2联赛PWL S2 SZ vs LBZS 第一场 11.26
2020/11/30 DOTA
Python中splitlines()方法的使用简介
2015/05/20 Python
Python模拟脉冲星伪信号频率实例代码
2018/01/03 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
python元组的概念知识点
2019/11/19 Python
Python for循环与getitem的关系详解
2020/01/02 Python
PyQt5中多线程模块QThread使用方法的实现
2020/01/31 Python
支票、地址标签、包装纸和慰问卡:Current Catalog
2018/01/30 全球购物
The North Face北面美国官网:美国著名户外品牌
2018/09/15 全球购物
实用的简历自我评价
2014/03/06 职场文书
聚美优品广告词改编
2014/03/14 职场文书
C++程序员求职信
2014/05/07 职场文书
国庆庆典邀请函
2015/02/02 职场文书
营业员岗位职责范本
2015/04/14 职场文书
演讲稿:​快乐,从不抱怨开始!
2019/04/02 职场文书
(开源)微信小程序+mqtt,esp8266温湿度读取
2021/04/02 Javascript
Nginx禁止ip访问或非法域名访问
2022/04/07 Servers