jQuery中的.attr()和.prop()方法 - 操作元素属性的细节解析

最新推荐文章于 2025-04-18 09:36:44 发布
最新推荐文章于 2025-04-18 09:36:44 发布
阅读量637 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： jquery 前端 javascript jQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/WfTest/article/details/133368666
jQuery 专栏收录该内容
39 篇文章 ¥59.90 ¥99.00
订阅专栏
本文探讨了jQuery中操作元素属性的[attr()]和[prop()]方法，讲解了它们的使用方法、区别及适用场景。.attr()适用于HTML属性，返回字符串值，而.prop()适合处理DOM属性和布尔值，可用于设置布尔属性。

在jQuery中，我们经常需要操作HTML元素的属性。为此，jQuery提供了两个常用的方法：.attr()和.prop()。这两个方法有着相似的功能，但在某些情况下会有一些细微的差异。本文将详细介绍.attr()和.prop()方法的使用方法以及它们之间的区别。

.attr()方法

.attr()方法用于获取或设置HTML元素的属性。它通过属性名称作为参数来操作元素的属性。下面是.attr()方法的基本语法：

$(selector).attr(attributeName)
$(selector).attr
了解本专栏 订阅专栏 解锁全文
jQuery attr() 方法和 prop() 方法区别
zcc的博客
12-07 4188
jQueryattr()方法 定义和用法 attr() 方法设置或返回被选元素的属性和值。 当该方法用于返回属性值，则返回第一个匹配元素的值。 当该方法用于设置属性值，则为匹配元素设置一个或多个属性/值对。 jQueryprop()方法 定义和用法 prop() 方法设置或返回被选元素的属性和值。 当该方法用于返回属性值时，则返回第一个匹配元素的值。 当该方法用于设置属性值时，则为匹配元素集合设置一个或多个属性/值对。 注意：prop() 方法应该用于检索属性值，例如 DO...
jquery中attr和prop的区别分析
10-24
在jQuery中，`attr` 和 `prop` 是两个用于获取和设置HTML元素属性的方法，但它们之间存在着重要的差异。理解这两个方法的区别对于高效且准确地操作DOM至关重要。 首先，`attr` 方法主要用于处理HTML元素的自定义...
jQuery的.attr()方法
王魂风气的博客
01-11 8950
用了好几次这个方法，还是很疑惑，就去系统的学习了一下。 总结如下： .attr()方法是jQuery操作属性的一个方法。可以根据参数的不同，来获取或设置属性值。 .attr()方法常用的四个表达形式： 1 $(selector).attr(传入属性)：获取属性值，例： 获取iuput的value属性值 $("input").attr('value') 2 $(selector).attr(属性...
jquery中元素属性的操作以及attr()和prop()区别
weixin_52512511的博客
06-29 519
4. prop是从属性对象中取值，属性对象中有多少属性，就能获取多少值，不需要在页面中显示定义。attr('要设置的属性名','要设置的属性值') 传递两个参数的时候设置。prop('要设置的属性名','要设置的属性值') 传递两个参数的时候设置。2. prop 可以获取 元素自带的属性 但是不可以获取到 自定义的属性。所有的属性都会显示在标签上（原生属性和自定义属性都会在结构里显示)attr('要读取的属性名') 传递一个参数的时候读取。prop('要读取的属性名') 传递一个参数的时候读取。
jQuery中attr与prop
m0_52228992的博客
05-14 972
attr与prop非常相似，均可访问元素的属性值和设置属性值，但prop多用于设置（访问）DOM属性，attr没有限制,HTML、DOM均可 语法： 获取属性值：元素.attr("属性") 或者 元素.prop("属性") 设置属性值：元素.attr("属性","属性值") 或者 元素.prop("属性","属性值") 设置获取属性时，需要注意的是，这里的属性必须能够直接在html标签内写出，类似（<img src"XXX" width="100px">），这里的width可以访问并设.
jq中prop和attr的区别
aliven1的博客
05-02 424
prop()函数的结果:      1.如果有相应的属性，返回指定属性值。      2.如果没有相应的属性，返回值是空字符串。attr()函数的结果:      1.如果有相应的属性，返回指定属性值。      2.如果没有相应的属性，返回值是undefined。对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方...
jQuery使用元素属性attr赋值详解
10-24
在JavaScript的世界里，jQuery库极大地简化了DOM操作，包括对元素属性的操作。本文将深入探讨jQuery如何使用`attr`方法来赋值和处理元素的属性。 `attr`是jQuery中的一个核心方法，它用于获取、设置或者删除HTML...
JS中attr和prop属性的区别以及优先选择示例介绍
12-08
在JavaScript的jQuery库中，`attr`和`prop`都是用于获取或设置元素属性的方法，但它们之间存在一些重要的区别。这些方法的使用场景不同，理解它们的差异对于编写高效且正确的JavaScript代码至关重要。 首先，`attr`...
深入解析jQuery .prop()属性在全选与反选中的应用
在jQuery中，.prop()方法用于获取或设置元素的属性值。与.attr()方法不同，.prop()用于处理DOM属性，这些属性名通常为JavaScript属性。.prop()方法能够正确处理像`checked`、`selected`、`disabled`这样的属性，这些...
jquery中的prop和attr
Liu_Jun_Tao的博客
03-04 620
上周在做业务时，遇到的一个小问题，根据后台传的值，初始化表单页面的状态，在设置下拉列表的选中值时，有些没有生效。 $("#card_type").attr('selected','selected'); 后面改成了 $("#card_type").prop('selected',true); 找了下两者的区别，这里记录下： 对于checkbox,select这类的标签，...
jQuery中 prop() attr()使用详解
weixin_30470643的博客
11-09 181
对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。 对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。 在高版本的jquery引入prop方法后，什么时候该用prop？什么时候用attr？它们两个之间有什么区别？这些问题就出现了。 关于它们两个的区别，网上的答案很多。这里谈谈我的心得，我的心得很简单： 对于HTML元素本身就带有的固有属性，在处理时，使...
jQuery中attr()与prop()函数用法实例详解(附用法区别)
jingshaozhi的博客
09-21 762
本文实例讲述了jQuery中attr()与prop()函数用法。分享给大家供大家参考，具体如下： 一、jQuery的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是attribute（属性）的缩写，在jQuery DOM操作中会经常用到attr()，attr()有4个表达式。 1. attr(属性名) //获取属性的值（取得第一个匹配元素的属性值
jquery中关于attr和prop的区别！
Java&Develop的博客
06-13 5892
昨天这两个方法搞混了,被公司大佬说了下，虽然没说什么，但还是挺尴尬的。重点是大佬说你可以用attr方法，我特么第一句话就是怎么用呢。原谅我使用vue之后太依赖框架的东西了，以至于以前jquery玩的也挺溜的我，慢慢淡忘了 jquery。罪过罪过呢！jquery还是一款很优秀的函数库，哎 不说了 继续码代码了。 $().attr() 允许我们往元素上加上自定义属性 我们也可以用attr 获取提前定义好的在上面的 自定义属性值 当然 也可以获取到 元素 自带的一些属性 那么 attr 是获取和设置 属性的
jq中 attr与prop
qq_45449432的博客
08-16 391
jquery中能对属性进行操作的有attr与prop方法 谈谈我的理解： prop：能够获取与处理html元素中的固有属性， attr： 能够获取html元素中的自定义属性 在处理固有属性性时，推荐使用prop方法。原因下文将会提到 <a class="Name" href="http://www.baidu.com">点我跳转</a> console.log($('a').prop('href'))//http://www.baidu.com console.log($('a').
jQuery 自学笔记（五）——— attr() 操作属性、prop() 操作布尔类型、尺寸和位置操作
秀岩的博客
01-04 3111
一、attr() 操作属性 1.1 设置属性 1.2 获取属性 1.3 移除属性 二、 prop() 操作布尔类型的属性 2.1 原生 js 操作 checked 属性 2.2 jQuery 操作 checked 属性 2.3 表格全选反选 三、尺寸和位置操作 3.1 width() 方法与 height() 方法 3.2 offset() 方法 与 position() 方法 3.3 scrollTop()方法 和 scrollLeft()方法
jQuery 对比 .attr() 和 .prop()
最新发布
monian187的博客
04-18 901
jquery 获取和修改标签属性的 api .attr() 和 .prop() 对比。
jQuery的attr()与prop()
Lincain的博客
06-21 318
文章转自：https://www.cnblogs.com/dolphinX/p/3348582.html jQuery1.6中新添加了一个prop方法，看起来和用起来都和attr方法一样，这两个方法有什么区别呢？这要从HTMl 的attribute与property区别说起，attr与prop正是这两个东西的缩写。 attribute与property attribute和property都可...
浅谈jquery中prop()和attr()
weixin_30315905的博客
07-20 111
我们都知道，一般在jquery中设置属性时要用到attr()方法，现在我们有一个效果，点击按钮切换复选框的选中状态，下面贴出html代码： <input type="checkbox" id="check"> <label>复选框</label> <input type="button" value="切换" id="btn"> ...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值