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仿Excel表格编辑功能的实现代码
May 01 Javascript
JavaScript动态创建div属性和样式示例代码
Oct 09 Javascript
javascript定义变量时有var和没有var的区别探讨
Jul 21 Javascript
新入门node.js必须要知道的概念(必看篇)
Aug 10 Javascript
深究AngularJS如何获取input的焦点(自定义指令)
Jun 12 Javascript
在 Angular 中使用Chart.js 和 ng2-charts的示例代码
Aug 17 Javascript
浅谈Vue 初始化性能优化
Aug 31 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
Sep 07 Javascript
Vue点击切换颜色的方法
Sep 13 Javascript
解析vue、angular深度作用选择器
Sep 11 Javascript
原生js实现密码强度验证功能
Mar 18 Javascript
vue 导航菜单刷新状态不消失,显示对应的路由界面操作
Aug 06 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目录管理函数小结
2008/09/10 PHP
基于PHP服务端图片生成缩略图的方法详解
2013/06/20 PHP
php中mysql连接和基本操作代码(快速测试使用,简单方便)
2014/04/25 PHP
PHP中捕获超时事件的方法实例
2015/02/12 PHP
php-redis中的sort排序函数总结
2015/07/08 PHP
PHP实现简单数字分页效果
2015/07/26 PHP
解决laravel查询构造器中的别名问题
2019/10/17 PHP
js自动生成的元素与页面原有元素发生堆叠的解决方法
2014/09/04 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件
2015/12/20 Javascript
Angular.js中$resource高大上的数据交互详解
2017/07/30 Javascript
Javascript的console['']常用输入方法汇总
2018/04/26 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
vue 父组件给子组件传值子组件给父组件传值的实例代码
2019/04/15 Javascript
vue获取时间戳转换为日期格式代码实例
2019/04/17 Javascript
简单了解微信小程序的目录结构
2019/07/01 Javascript
js重写alert事件(避免alert弹框标题出现网址)
2020/12/04 Javascript
[01:15:16]DOTA2-DPC中国联赛 正赛 Elephant vs Aster BO3 第一场 1月26日
2021/03/11 DOTA
python使用socket进行简单网络连接的方法
2015/04/29 Python
Python提取Linux内核源代码的目录结构实现方法
2016/06/24 Python
浅谈五大Python Web框架
2017/03/20 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
python爬虫获取小区经纬度以及结构化地址
2018/12/30 Python
python实现二分类的卡方分箱示例
2019/11/22 Python
python使用itchat模块给心爱的人每天发天气预报
2019/11/25 Python
基于Python3.7.1无法导入Numpy的解决方式
2020/03/09 Python
python3中datetime库,time库以及pandas中的时间函数区别与详解
2020/04/16 Python
Python正则表达式如何匹配中文
2020/05/27 Python
萌新HTML5 入门指南(二)
2020/11/09 HTML / CSS
大学毕业通用个人的求职信
2013/12/08 职场文书
学校领导班子对照检查材料
2014/08/28 职场文书
教师三严三实学习心得体会
2014/10/11 职场文书
电力工程合作意向书
2015/05/11 职场文书
国庆节新闻稿
2015/07/17 职场文书
学生会工作感言
2015/08/07 职场文书
SQL Server连接查询的实用教程
2021/04/07 SQL Server