刚刚看博客无意中看到attr()和prop()的区别,回头就去翻了一下手册,感觉手册上写的过于简单,不能很清晰的分辨出两者的区别,两者的参数用法都是高度相似。

attr():设置或返回被选元素的属性值。

prop():获取在匹配的元素集中的第一个元素的属性值。

这是手册上的概述,关于具体的参数在这儿就不一一列举出来了。

看完实例以后感觉还是没有太搞明白两者是什么区别,随即去百度上看看了一下芈老头(芈字害我试了好久才打出来,幸好之前有个芈月传)的博客,上面是这么写的。

关于它们两个的区别:

  • 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
  • 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。

看完以后感觉还是云里雾里的,迷迷糊糊,随后看到博客后面的评论对他的观点进行了一个很好的解释,是这么写的:

(1) <a href="#" target="_self" class="btn">百度</a>
alert($("a").prop("class")); -----------》btn
alert($("a").attr("class")); -----------》btn
虽然说attr()是获取自定义属性,prop是获取固有属性但是其实attr()也能获取到固有的属性,真正能够体现这俩的不同的是自定义属性上的获取和在获取标签中没有显示设置的固有属性的情况中,两种情况分别在(2)和(3)中解释。
a标签里面的 href,target,class都是固有属性所以都可以获取,自然不存在undefined的情况。
(2)在 (1)的基础上加个自定义的属性试试
<a href="#" target="_self" class="btn" action="#" >百度</a> 
alert($("a").prop("action")); -----------》undefined
alert($("a").attr("action")); -----------》#
在这里你就可以看到prop是不能够获取自定义属性的。
(3)楼主的最后一个例子怎么说呢,我觉得是在解释什么是固有属性,我将(1)种的class属性去掉。
<a href="#" target="_self" ">百度</a>
alert($("a").prop("class")); -----------》 空
alert($("a").attr("class")); -----------》undefined
prop是固有属性,固有属性的意思是它知道你有这个属性,你没有写,它也知道,只是你没去设置而已。你没有设置它就返回默认值,楼主的的那个例子中checked的默认值就是false,对于class来说你没设置默认值应该就是为空。
attr是自定义属性,你不在标签里写它就不知道,所以返回的是undefined。

我觉得关键在于最后的几句话

今天就先到这儿以后碰到了记得这么个问题就ok了。

纠结attr(),prop()的更多相关文章

  1. jquery之 css()方法。用法类似的有attr(),prop(),val()

    [注]attr(),prop(),val()的用法结构和css()一致,可参考 css()函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值. 该函数属于jQuery对象(实例).如 ...

  2. 关于jQuery中attr(),prop()的使用

    注意:什么时候使用attr(),什么时候使用prop()?1.添加属性名称该属性就会生效应该使用prop();2.是有true,false两个属性使用prop();3.其他则使用attr(); 以下是 ...

  3. attr(),prop()二者区别和最佳实践

    attr(),prop()二者区别和最佳实践 最近使用到attr()来获取自定义属性值,我印象中是有一个方法可以获取到自定义属性值,进而我又想到了另一个方法prop().  查看了手册发现并没有对二者 ...

  4. JQUERY attr prop 的区别 一个已经被淘汰

    在做jquery 全选 全不选的项目中, 1..prop( propertyName ) 获取匹配集合中第一个元素的Property的值 2. .prop( propertyName, value ) ...

  5. query attr prop区别

    大家都知道有的浏览器只要写disabled,checked就可以了,而有的要写成disabled = "disabled",checked="checked", ...

  6. jQuery.attributes源码分析(attr/prop/val/class)

    回顾 有了之前的几篇对于jQuery.attributes相关的研究,是时候分析jQuery.attr的源码了 Javascript中的attribute和property分析 attribute和p ...

  7. attr prop jquery关于获取DOM属性值的两个函数

    $('#domid').attr('acitve') $('#domid').prop('checked') // 在使用JQUERY获取DOM元素的属性时,有两个函数,attr 和 prop < ...

  8. jquery,attr,prop,checkbox标签已有checked=checked但是不显示勾选

    最近在做项目的过程中碰到了这样的一个问题:在使用bootstrap模态框的过程中,在模态框中有一个checkbox标签,一开始是为选中的,当点击触发模态框按钮,选中chcekbox时,会显示勾选,这个 ...

  9. JQ attr prop 区别

    解决方法:使用prop属性代替attr属性 一.Attr除 checked, selected, 或 disabled状态属性外,其余的属性均可用attr()设置和修改.$("img&quo ...

随机推荐

  1. ZACC_DOCUMENT

    method if_ex_acc_document~change. data: wa_extension type bapiparex, ext_value() type c, wa_accit ty ...

  2. C#关于winforms窗体大小、边框、移动、动画等属性

    1.窗体的边框设置为无: 2.把窗体高度调整为25,发现跑的时候总在40左右,这时需要改改属性, 把MinimumSize(0, 0)改成不为0的,最好改成和自己想要一样的大小, 最大高宽也应该这么调 ...

  3. Scala 高级编程练习

    定义自己的控制结构,使它语言内置的用法一样 package exp object Main { def enableCustomerIF = false; def main(args: Array[S ...

  4. Git 仓库和记录操作到仓库

    Git 配置好了,来 clone 个或者新建个仓库来试试, $ git clone git@github.com:git/git.git 把 Git 的源码克隆下来,克隆会自动创建本地仓库,并创建本地 ...

  5. callback 转换到 promise

    最近项目迭代,从express到koa,面对callback,想偷懒,就想到了Proxy对象 new Proxy(docker,{ get : function (obj,name) { return ...

  6. keep the bar green to keep the code clean——Junit详解(一)

    测试用例 单元测试时每个开发人员必需掌握的,是保证开发过程中代码的准确性,无误性,保证代码质量.敏捷开发模式是先根据用户需求写测试用例,考虑基本所有用户所需要的情况,再写实现方法.单元测试有很多种,当 ...

  7. .Net模拟提交表单

    2016-09-0210:49:20 以中邮速递API为服务接口,由于提交方式为表单提交,我要获取返回值来处理其他业务,所以一开始尝试采用Js后台获取返回值,但是涉及到跨域请求限制问题,那边服务端接口 ...

  8. IOS setValue forKey

    NSObjiect *obj:[obj setValue:value forKey:@"cpname"]复制代码的时候都会出现这个异常this class is not key v ...

  9. 作业七:团队项目——Alpha版本冲刺阶段006

    今日进展:完成主体代码. 今日安排:对程序主体进行编写.

  10. logsatsh input 插件之 collectd

    logsatsh input 插件之 collectd 标签(空格分隔): logstash 作用:用于监控内存,cpu,磁盘I等信息 未完待续,时间未定. 参考: logstash 官网 elast ...