.attr( ) 可以设置元素的属性(也就是给元素新增加一个原来并不存在的属性)也可以获取元素的本来就有的属性以及额外设置的属性。如果要获取的属性没有设置,那么获取到的结果是 undefined; 
.prop( )可以设置元素的属性(HTML固有的属性,可以给元素添加属性)也可以获取元素的固有的属性值,如果是额外设置的其他属性,则无法通过prop( )获取。 

.css() 只能获取是 style 里面的属性值; 
注意语法:获取style样式属性值:对象.css(“属性名”),设置style样式属性值:对象.css(“属性名”),设置style样式属性值:对象.css(“属性名”,“属性值”)双引号必不可少

对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。

对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。

<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"

总结: 
1 如果想要通过attr()获取属性值,那么该属性必须显式的设置在HTML代码中或者通过attr新增的属性才能被获取到,如果没有设置,那么将返回undefined 
2 如果通过prop()获取属性值,那么该属性只能是HTMl的固有属性,无论是否显式的设置,都可以获取其对应的属性值,如果是额外增加的属性,那么将无法获取。

转载自:https://www.cnblogs.com/lijianda/p/9562064.html

【jQuery】attr()、prop()、css() 的区别(转载)的更多相关文章

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

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

  2. jQuery attr() prop() data()用法及区别

    .attr(),此方法从jq1.0开始一直存在,官方文档写的作用是读/写DOM的attribute值,其实1.6之前有时候是attribute,有时候又是property..prop(),此方法jq1 ...

  3. $().attr() 和 $().css的区别

    使用jquery的.attr( )方法去给div隐藏,这样写的 $("#div_id").attr("display","none"),发现 ...

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

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

  5. jquery .width和css("width", )区别

    1.$.fn.width会根据是否是borderBox来计算新的宽度,如果是borderBox,会额外加上padding和border的宽度,计算时只是按照px来,用rem做单位会出错: 2.$.fn ...

  6. jquery里prop和attr的区别

    本文通过具体的实例来讲述jquery里prop和attr的区别及使用方法. 在jquery里,我们要获取一个标签元素的属性,可以用attr或者prop,那么两者有什么区别呢? 其实很简单: attr可 ...

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

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

  8. jquery中prop()方法和attr()方法的区别浅析

    官方例举的例子感觉和attr()差不多,也不知道有什么区别,既然有了prop()这个新方法,不可能没用吧,那什么时候该用attr(),什么时候该用prop()呢 jquery1.6中新加了一个方法pr ...

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

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

  10. [jQuery]attr和prop的区别

    转自:http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html 在高版本的jquery引入prop方法后,什么时候 ...

随机推荐

  1. 进程通过内核缓存区请求设备I/O的一些事情

    请求进程,内核缓存区,设备I/O 请求进程无法直接访问设备I/O,而是通过内核缓冲区提交请求数据,等数据就绪后,数据从设备缓冲区提交至进程空间 请求进程把数据提交给内核缓存空间需要等待,内核把数据复制 ...

  2. ACM-ICPC 2017 沈阳赛区现场赛 M. Wandering Robots && HDU 6229(思维+期望)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6229 参考题解:https://blog.csdn.net/lifelikes/article/det ...

  3. ansible-playbook 显示命令返回结果

    --- - hosts: test gather_facts: F #开启debug vars: war: "ps -ef | grep tomcat | grep -v grep | aw ...

  4. [Luogu] 无线网络发射器选址

    https://www.luogu.org/problemnew/show/P2038 二维前缀和 #include <iostream> #include <cstdio> ...

  5. Noip2016 提高组 Day2 T1 组合数问题

    题目描述 组合数表示的是从n个物品中选出m个物品的方案数.举个例子,从(1,2,3) 三个物品中选择两个物品可以有(1,2),(1,3),(2,3)这三种选择方法.根据组合数的定 义,我们可以给出计算 ...

  6. js创建链表

    首先要明确,我们为什么要创建链表呢?数组的大小是固定的,从数组的起点或中间插入或移除的成本很高,因为需要移动元素.尽管JS的Array类方法可以做这些,但是情况也是这样.链表存储有序的元素集合,但不同 ...

  7. python 查看源代码

    使用包inspect import inspect from mxnet import contrib 查看模块所在路径: inspect.getsourcefile(contrib) 查看源码: i ...

  8. redis常见7种使用场景

    一,简单字符串缓存实例 $redis->connect('127.0.0.1', 6379); $strCacheKey = 'Test_bihu'; //SET 应用 $arrCacheDat ...

  9. HTTP之Cookie和Session

    1. Cookie 1.1 为什么需要 Cookie? HTTP 协议是一种无状态的协议,也就是说,当前的 HTTP 请求与以前的 HTTP 请求没有任何联系.显然,这种无状态的情形在某些时候将让用户 ...

  10. Java-Unsafe

    Unsafe 是 sun.misc 包下的一个类,可以直接操作堆外内存,可以随意查看及修改 JVM 中运行时的数据,使 Java 语言拥有了类似 C 语言指针一样操作内存空间的能力. Unsafe 的 ...