jq .attr()和.prop()方法的区别
今天在nodejs交流群里面遇到别人在里面说面试的时候遇到了这个问题,没回答出来,面试官讲的他也不明白,这个问题看着很简单,但是往深的解释就很难了。
- 对于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值。
例子2:
<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"
jq .attr()和.prop()方法的区别的更多相关文章
- jQuery中attr和prop方法的区别
jQuery中attr和prop方法的区别。 http://my.oschina.net/bosscheng/blog/125833 http://www.javascript100.com/?p=8 ...
- jQuery中attr和prop方法的区别说明
jquery中attr和prop的基本区别可以理解为:如果是内置属性,建议用prop,如果是自定义的建议用attr. 例如 <input type=check node=123 id=ck & ...
- jQuery 中 attr() 和 prop() 方法的区别
前几天,有人给 Multiple Select 插件 提了问题: setSelects doesn't work in Firefox when using jquery 1.9.0 一直都在用 jQ ...
- jQuery 中 attr() 和 prop() 方法的区别<转>
前几天,有人给 Multiple Select 插件 提了问题: setSelects doesn't work in Firefox when using jquery 1.9.0 一直都在用 jQ ...
- jquery attr()和prop()方法的区别
$('').attr()返回的是html对象 $('').prop()返回的是DOM对象 attr(): attr() 方法设置或返回被选元素的属性和值. 当该方法用于返回属性值,则返回第一个匹配元素 ...
- jquery中dom元素的attr和prop方法的理解
一.背景 在编写使用高版本[ jQuery 1.6 开始新增了一个方法 prop()]的jquery插件进行编写js代码的时候,经常不知道dom元素的attr和prop方法到底有什么区别?各自有什么应 ...
- input是否checked与使用jquery的attr或prop方法无关
最近在项目中有这样一个需求,用户在下单时可以选择优惠券,也可取消选择,并且可以多次选择,取消. 这是一个典型的input标签checked功能,博主使用radio元素实现此需求,但是优惠券只能选中,不 ...
- jquery里的attr()方法和prop()方法的区别
在jq的高版本里出现了prop()方法,那么attr()和prop()的区别在哪呢?这两者分别在什么情况用呢? 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. 对于HTML元素我们 ...
- jq的attr、prop和data区别
prop()获取在匹配的元素集中的第一个元素的属性值. 大家都知道有的浏览器只要写disabled,checked就可以了,而有的要写成disabled = "disabled", ...
随机推荐
- Android APK反编译就这么简单 具体解释
在学习Android开发的过程你.你往往会去借鉴别人的应用是怎么开发的,那些美丽的动画和精致的布局可能会让你爱不释手,作为一个开发人员.你可能会非常想知道这些效果界面是怎么去实现的,这时,你便能够对改 ...
- 深入了解UIAutomation 的API
有关UiAUiAutomation的API对象的文件名称. 1.UIAutomation中的对象都是以UIA#####开头的出现的.eg:UIAButton 2.有关Logger对象负责日志的输出 U ...
- Android Studio3.0 配置ButterKnife出错的解决
需要注意的问题: (1)ButterKnife.bind(this);必须在设置布局之后进行初始化: 官方升级到了8.8.1了 compile 'com.jakewharton:butterknife ...
- 系统时钟和UART的设置
系统时钟: 在开发版上,不同的器件运行在不同的时钟频率上,如CPU可能运行在400Mhz的频率上.SDRAM.DM9000等内存存储运行在100Mhz~133MHz上. 串口i2c等运行在50Mhz上 ...
- PHP 如何成长 (收藏自:http://www.cnblogs.com/try-better-tomorrow/p/6964036.html)
原文题目为<php程序员学C/C++>,不过我觉得说是提升自己比较合适. 身边有几个做PHP开发的朋友,因为面试,也接触到不少的PHP工程师,他们常疑虑自己将来在技术上的成长与发展,我常给 ...
- Android无线测试之—UiAutomator UiDevice API介绍四
拖拽与滑动 一.概念介绍: 1)拖拽:将组建从一个坐标移动到另一个坐标 2)移动:从一二坐标点移动到另一个坐标点 3)步长:从一点滑动到另一点使用的时间 二.拖拽与滑动的相关API: 返回值 方法名 ...
- 通过w3c方式 读取xml内容
/** * 通过w3c方式 读取xml内容 * @param lablenames 要读取的节点名称 * @param file_path_name 文件绝对路径 * @return */ publi ...
- Bootstrap(Web前端CSS框架)
官方定义: Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile fi ...
- HTML学习笔记——常用元素及其属性(二)
一.HTML表单 -- form标签 -- 与浏览者交互 1.form 标签 -- 代表HTML表单 form标签是成对出现的,以<form>开始,以</form>结束 属性. ...
- JavaScript中的对象类型详解
To be finished 摘要 1.什么是对象? 2.引用类型和原始类型 3.对象数据属性拥有的特性(Attributes) 4.如何创建对象 a.直接定义 var mango={color:&q ...