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", ...
随机推荐
- [转]unity3d所要知道的基础知识体系大纲,可以对照着学习,不定期更新 ... ... ... ...
本文献给,想踏入3d游戏客户端开发的初学者. 毕业2年,去年开始9月开始转作手机游戏开发,从那时开始到现在一共面的游戏公司12家,其中知名的包括搜狐畅游.掌趣科技.蓝港在线.玩蟹科技.天神互动.乐元素 ...
- 辛星教你高速掌握PHP的正則表達式
首先说一下,这篇文章也是我在看了数个大牛的博客之后总结出来的,因此首先向这些大牛表示崇高的敬意和感谢,因为人数众多.并且来源也是特别分散,就不一一介绍了,见谅. ************跨语言的主题* ...
- 如何使用NSOperations和NSOperationQueues
原文地址: http://www.raywenderlich.com/19788/how-to-use-nsoperations-and-nsoperationqueues 本文由 大侠自来也(泰然教 ...
- 次小生成树模板(poj1679)
prim #include <iostream> #include <cstdio> #include <cstdlib> #include <cmath&g ...
- EasyPlayer.js网页全终端播放器安装使用文档
EasyPlayer.js 集 rtmp, hls, flv, websocket 于一身的网页直播/点播播放器, 使用简单, 功能强大 属性(Property) video-url 视频流地址 St ...
- JS实现过一段时间后清理数据(以Lable为例)
<script type="text/javascript"> var t function cleaData() { t = setTimeout(syc, 3000 ...
- zookeeper 命令行使用
先用简易的客户端链接上 默认链接的就是本机上面的zkserver 我一上来help 下.没办法 ,用的少,先喊一声救命 ,看看有没有人救我! [zk: localhost:2181(CONNECTED ...
- Java基础 - 流程控制语句
package com.demo4; /* * 流程控制语句 * 流程控制语句分类: * 顺序结构 * 代码从上往下按照顺序执行 * * 选择结构 * if * if (关系表达式1) { * 语句体 ...
- jquery拓展插件开发
学习参考网址整理: http://blog.csdn.net/chenxi1025/article/details/52222327 http://www.cnblogs.com/ellisonDon ...
- qt sql 模块有哪些类?
Class Description translate.google QSqlDatabase Handles a connection to a database 处理与数据库的连接 QSqlDri ...