jquery中prop()方法和attr()方法的区别浅析


Posted in Javascript onSeptember 06, 2013

jquery1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值。

大家都知道有的浏览器只要写disabled,checked就可以了,而有的要写成disabled = "disabled",checked="checked",比如用attr("checked")获取checkbox的checked属性时选中的时候可以取到值,值为"checked"但没选中获取值就是undefined。

jq提供新的方法“prop”来获取这些属性,就是来解决这个问题的,以前我们使用attr获取checked属性时返回"checked"和"",现在使用prop方法获取属性则统一返回true和false。

那么,什么时候使用attr(),什么时候使用prop()?
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();
项目中jquery升级的时候大家要注意这点!

以下是官方建议attr(),prop()的使用:

Attribute/Property .attr() .prop()
accesskey  
align  
async
autofocus
checked
class  
contenteditable  
draggable  
href  
id  
label  
location ( i.e. window.location )
multiple
readOnly
rel  
selected
src  
tabindex  
title  
type  
width ( if needed over .width() )  
Javascript 相关文章推荐
JS实现点击下载的小例子
Jul 10 Javascript
Javascript selection的兼容性写法介绍
Dec 20 Javascript
浅谈页面装载js及性能分析方法
Dec 09 Javascript
jQuery实现数秒后自动提交form的方法
Mar 05 Javascript
JS判断浏览器是否安装flash插件的简单方法
Sep 13 Javascript
微信小程序 rpx 尺寸单位详细介绍
Oct 13 Javascript
深入理解vue Render函数
Jul 19 Javascript
Angular17之Angular自定义指令详解
Jan 21 Javascript
vue2中使用sass并配置全局的sass样式变量的方法
Sep 04 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
Nov 30 Javascript
ES6 Object方法扩展的应用实例分析
Jun 25 Javascript
关于vue 结合原生js 解决echarts resize问题
Jul 26 Javascript
CheckBoxList多选样式jquery、C#获取选择项
Sep 06 #Javascript
jquery阻止冒泡事件使用模拟事件
Sep 06 #Javascript
Jquery的hover方法让鼠标经过li时背景变色
Sep 06 #Javascript
Jquery的hide及toggle方法让超链接慢慢消失
Sep 06 #Javascript
JS远程获取网页源代码实例
Sep 05 #Javascript
JSON序列化与解析原生JS方法且IE6和chrome测试通过
Sep 05 #Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
Sep 05 #Javascript
You might like
php随机输出名人名言的代码
2012/10/07 PHP
php实现的Curl封装类Curl.class.php用法实例分析
2015/09/25 PHP
PHP实现的多文件上传类及用法示例
2016/05/06 PHP
Laravel最佳分割路由文件(routes.php)的方式
2016/08/04 PHP
阿里对象存储OSS在laravel框架中的使用方法
2019/10/13 PHP
PHP常用函数之base64图片上传功能详解
2019/10/21 PHP
jQuery 表单验证扩展(四)
2010/10/20 Javascript
JS隐藏参数post传值实例
2013/04/18 Javascript
通过Javascript读取本地Excel文件内容的代码示例
2014/04/08 Javascript
Javascript中Array.prototype.map()详解
2014/10/22 Javascript
js简单设置与使用cookie的方法
2016/01/22 Javascript
jQuery的deferred对象使用详解
2016/09/25 Javascript
JavaScript中英文字符长度统计方法示例【按照中文占2个字符】
2017/01/17 Javascript
Bootstrap多级菜单的实现代码
2017/05/23 Javascript
vue-router项目实战总结篇
2018/02/11 Javascript
动态内存分配导致影响Javascript性能的问题
2018/12/18 Javascript
Vue的H5页面唤起支付宝支付功能
2019/04/18 Javascript
JS实现的排列组合算法示例
2019/07/16 Javascript
[02:44]DOTA2英雄基础教程 钢背兽
2013/12/19 DOTA
[00:59]DOTA2英雄背景故事——上古巨神
2020/06/28 DOTA
Python实现的数据结构与算法之快速排序详解
2015/04/22 Python
python获取文件真实链接的方法,针对于302返回码
2018/05/14 Python
对python 数据处理中的LabelEncoder 和 OneHotEncoder详解
2018/07/11 Python
Python3几个常见问题的处理方法
2019/02/26 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
什么是python的自省
2020/06/21 Python
Python基于gevent实现文件字符串查找器
2020/08/11 Python
Python趣味入门教程之循环语句while
2020/08/26 Python
Ubuntu16安装Python3.9的实现步骤
2020/12/15 Python
德国家具购物网站:Möbel Höffner
2019/08/26 全球购物
车工岗位职责
2013/11/26 职场文书
班主任工作经验交流材料
2014/05/13 职场文书
兽医医药专业求职信
2014/07/27 职场文书
《雷雨》教学反思
2016/02/20 职场文书
总结几个非常实用的Python库
2021/06/26 Python
Python实现学生管理系统并生成exe可执行文件详解流程
2022/01/22 Python