今天在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()方法的区别的更多相关文章

  1. jQuery中attr和prop方法的区别

    jQuery中attr和prop方法的区别。 http://my.oschina.net/bosscheng/blog/125833 http://www.javascript100.com/?p=8 ...

  2. jQuery中attr和prop方法的区别说明

    jquery中attr和prop的基本区别可以理解为:如果是内置属性,建议用prop,如果是自定义的建议用attr. 例如 <input type=check  node=123 id=ck & ...

  3. jQuery 中 attr() 和 prop() 方法的区别

    前几天,有人给 Multiple Select 插件 提了问题: setSelects doesn't work in Firefox when using jquery 1.9.0 一直都在用 jQ ...

  4. jQuery 中 attr() 和 prop() 方法的区别<转>

    前几天,有人给 Multiple Select 插件 提了问题: setSelects doesn't work in Firefox when using jquery 1.9.0 一直都在用 jQ ...

  5. jquery attr()和prop()方法的区别

    $('').attr()返回的是html对象 $('').prop()返回的是DOM对象 attr(): attr() 方法设置或返回被选元素的属性和值. 当该方法用于返回属性值,则返回第一个匹配元素 ...

  6. jquery中dom元素的attr和prop方法的理解

    一.背景 在编写使用高版本[ jQuery 1.6 开始新增了一个方法 prop()]的jquery插件进行编写js代码的时候,经常不知道dom元素的attr和prop方法到底有什么区别?各自有什么应 ...

  7. input是否checked与使用jquery的attr或prop方法无关

    最近在项目中有这样一个需求,用户在下单时可以选择优惠券,也可取消选择,并且可以多次选择,取消. 这是一个典型的input标签checked功能,博主使用radio元素实现此需求,但是优惠券只能选中,不 ...

  8. jquery里的attr()方法和prop()方法的区别

    在jq的高版本里出现了prop()方法,那么attr()和prop()的区别在哪呢?这两者分别在什么情况用呢? 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. 对于HTML元素我们 ...

  9. jq的attr、prop和data区别

    prop()获取在匹配的元素集中的第一个元素的属性值. 大家都知道有的浏览器只要写disabled,checked就可以了,而有的要写成disabled = "disabled", ...

随机推荐

  1. [转]unity3d所要知道的基础知识体系大纲,可以对照着学习,不定期更新 ... ... ... ...

    本文献给,想踏入3d游戏客户端开发的初学者. 毕业2年,去年开始9月开始转作手机游戏开发,从那时开始到现在一共面的游戏公司12家,其中知名的包括搜狐畅游.掌趣科技.蓝港在线.玩蟹科技.天神互动.乐元素 ...

  2. 辛星教你高速掌握PHP的正則表達式

    首先说一下,这篇文章也是我在看了数个大牛的博客之后总结出来的,因此首先向这些大牛表示崇高的敬意和感谢,因为人数众多.并且来源也是特别分散,就不一一介绍了,见谅. ************跨语言的主题* ...

  3. 如何使用NSOperations和NSOperationQueues

    原文地址: http://www.raywenderlich.com/19788/how-to-use-nsoperations-and-nsoperationqueues 本文由 大侠自来也(泰然教 ...

  4. 次小生成树模板(poj1679)

    prim #include <iostream> #include <cstdio> #include <cstdlib> #include <cmath&g ...

  5. EasyPlayer.js网页全终端播放器安装使用文档

    EasyPlayer.js 集 rtmp, hls, flv, websocket 于一身的网页直播/点播播放器, 使用简单, 功能强大 属性(Property) video-url 视频流地址 St ...

  6. JS实现过一段时间后清理数据(以Lable为例)

    <script type="text/javascript"> var t function cleaData() { t = setTimeout(syc, 3000 ...

  7. zookeeper 命令行使用

    先用简易的客户端链接上 默认链接的就是本机上面的zkserver 我一上来help 下.没办法 ,用的少,先喊一声救命 ,看看有没有人救我! [zk: localhost:2181(CONNECTED ...

  8. Java基础 - 流程控制语句

    package com.demo4; /* * 流程控制语句 * 流程控制语句分类: * 顺序结构 * 代码从上往下按照顺序执行 * * 选择结构 * if * if (关系表达式1) { * 语句体 ...

  9. jquery拓展插件开发

    学习参考网址整理: http://blog.csdn.net/chenxi1025/article/details/52222327 http://www.cnblogs.com/ellisonDon ...

  10. qt sql 模块有哪些类?

    Class Description translate.google QSqlDatabase Handles a connection to a database 处理与数据库的连接 QSqlDri ...