今天在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. EasyUI DataGrid 相同连续列合并

    扩展方法:$.extend($.fn.datagrid.methods, { autoMergeCells: function(jq, fields) { return jq.each(functio ...

  2. 关闭数据库时SHUTDOWN: waiting for active calls to complete.处理

    有时候在关闭数据库时,发出shutdown immediate;命令后一直未关闭.查看ALERT日志.在等待一段时间后日志中有提示: SHUTDOWN: waiting for active call ...

  3. Unix OpenCV安装

    官方下载:https://sourceforge.net/projects/opencvlibrary/files/  最好下载2.4.13版本,不然可能会有很多奇奇怪怪的问题 解压后: mkdir ...

  4. Oracle SQL*Loader 数据导入工具

    SQL*Loader是一个向Orale大量倒数据的工具,可以从界定文件中导入数据如用 , 界定的,可以从定宽的文件导入数据,

  5. 如何在MySQL客户端Navicat 上创建存储过程返回结果集

    下述引用自<MySQL 必知必会> MySQL命令行客户机的分隔符 如果你使用的是MySQL命令行实用程序,应该仔细阅读此说明.默认的MySQL语句分隔符为;(正如你已经在迄今为止所使用的 ...

  6. 【BZOJ3122】[Sdoi2013]随机数生成器 BSGS+exgcd+特判

    [BZOJ3122][Sdoi2013]随机数生成器 Description Input 输入含有多组数据,第一行一个正整数T,表示这个测试点内的数据组数.   接下来T行,每行有五个整数p,a,b, ...

  7. IDEA中的lombok插件安装以及各注解的详细介绍

    IDEA中的lombok插件安装以及各注解的详细介绍 其实对于我们来说, 写好实体类后,直接用快捷方式生成get,set方法,还有 构造方法就行了,但是对于字段比较多的, 如果修改一个属性的话,就要再 ...

  8. :eq()中的参数详解——需要注意

    :eq()的括号中的参数如果是非负数则在DOM对象中按从上到下的顺序查找指定的元素,但是,如果是是负数,则在DOM中从下向上查找指定元素. 如下实例: 如果 $("#divTag div:e ...

  9. 巨蟒django之权限10,内容梳理&&权限组件应用

    1.CRM项目内容梳理: 2.权限分配 3.权限组件的应用

  10. 一个经验丰富的网站建设程序员的CSS资料

    没有就不能活的 53 个 CSS 技术 对新手实用的 20 个 CSS 建议 快速编写更好 CSS 代码的 5 种方法 50+ 个 CSS 创意案例和教程 101 个 CSS 小贴士.教程和范例 CS ...