attr 与 prop 都可以对某个属性进行获取和设置的操作，二者的用法相同：

<script src = 'jQuery.js'></script>

<script>

    // attr:

    // 设置单个属性

    $(element).attr(name,value);

    // 设置多个属性

    $(element).attr(obj);

    // 获取属性

    $(element).attr(name);

    // prop:

    // 设置单个属性

    $(element).prop(name,value);

    // 设置多个属性

    $(element).prop(obj);

    // 获取属性

    $(element).prop(name);

</script>

用处和区别却是不一样的，对于返回值是布尔类型的属性，如：disabled, checked只能使用 prop 进行操作，当然更大的区别在于，attr 操作的是写在元素内的字面属性，而 prop 操作的是元素的 DOM 属性：

<body>

    // 以访问网站的形式打开页面

    // 例：假设文件在C盘中，上层主目录文件夹为 folder-min

    <img id="img" src="/folder/image.jpg" />

    <input id="check1" type="checkbox" checked="checked" />

    <input id="check2" type="checkbox" />

<script>

    $( '#img' ).attr( 'src' );  // 控制台输出："/folder/image.jpg"

    $( '#check' ).prop( 'src' );  // "http://folder-min/folder/image.jpg"

    $( '#check1' ).attr( 'checked' );  // checked

    $( '#check1' ).prop( 'checked' );  // true 或 false 取决于复选框状态

    $( '#check2' ).attr( 'checked' );  // undefined

    $( '#check2' ).prop( 'checked' );  // true 或 false 取决于复选框的状态

</script>

</body>

jQuery中操作属性的方法attr与prop的区别的更多相关文章

  1. js进阶 11-18 jquery中操作选择器的方法有哪些

    js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...

  2. jQuery中获取属性值：attr()、html()、text()、val()等(一)

    <!DOCTYPE html> <html> <head> <title>01_basic.html</title> <meta na ...

  3. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  4. 【转发】JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...

  5. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  6. jquery中attr和prop的区别、 什么时候用 attr 什么时候用 prop (转自 芈老头 )

    jquery中attr和prop的区别. 什么时候用 attr 什么时候用 prop   在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这 ...

  7. jQuery中.attr()和.prop()的区别

    之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...

  8. jquery中attr和prop的区别（转）

    在网络上看到这样一篇关于jquery中attr和prop的区别文章,觉得不错,所以转载了. 在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined.如果你要 ...

  9. jQuery中常用的函数方法

    jQuery中常用的函数方法总结 Ajax处理 load(url,[data],[callback]) url (String) : 待装入 HTML 网页网址. data (Map) : (可选) ...

随机推荐

  1. linux 下强大的 JSON 解析命令 jq

    介绍 jq is like sed for JSON data - you can use it to slice and filter and map and transform structure ...

  2. 在VS Code下配置Julia

    原来尝试用Sublime text3配置Julia,但是老是会出一些问题,所以直接在VS code下配置了 1.下载Julia 2.安装,安装过程和其他得软件安装一样,可以改变安装路径 3.安装完成后 ...

  3. Windows环境下搭建Cocos2d-x3.2环境并配置android交叉编译环境

    一.软件 1)VS2012(C++11特性在VS2012以上可以使用):传送门: 2)Cocos2d-x官网源码:传送门:http://cocos2d-x.org/download 3)JDK:传送门 ...

  4. 常用ElasticSearch 查询语句

    为了演示不同类型的 ElasticSearch 的查询,我们将使用书文档信息的集合(有以下字段:title(标题), authors(作者), summary(摘要), publish_date(发布 ...

  5. atom跨平台超好用的markdown实时预览

    https://atom.io/ sublime有预览markdown的插件,但仅限于每次在浏览器中预览,想要找一个能够实时在软件中预览的,终于发现了atom. 很多功能以插件的形式安装,theme也 ...

  6. python3_learn 实现文件夹内批量对图片重命名

    初衷 练习Python,提高动手能力. 珍藏的壁纸文件夹名命有点乱. 可以学习下一些基础的库 开始(.jpg,无筛选) First 首先找到OS库,寻找可以遍历文件名的.找到了OS.walk() os ...

  7. [转载]利用分块传输绕过WAF进行SQL注入

    原理 客户端给服务器发送数据的时候,如果我们利用协议去制作payload,就可以绕过http协议的waf,实现SQL注入 分块传输编码(Chunked transfer encoding)是HTTP中 ...

  8. AIX详细的VG,LV扩容步骤

    需求 1.归档日志刷得太快,经常把空间挤爆. 2.Oracle数据库表空间需要扩容 解决方案 1.先做重要数据备份 2.进行文件系统扩容 步骤 1. df -g 查找出/u01 对应的VG卷 VOLU ...

  9. Docker镜像与仓库(四)

    Dockerfile方式创建镜像 https://hub.docker.com/_/centos/ #找一个centos6.6 的dockerfile链接 [root@linux-node1 ~]# ...

  10. java基础问题 （待解决）

    (1)接口与抽象类的区别? (2)Java中的异常有哪几类?分别怎么使用? (3)常用的集合类有哪些?比如List如何排序? (4)ArrayList和LinkedList内部的实现大致是怎样的?他们 ...