摘要：后来了一番不知怎么搜索的又发现了一个和区别的一些解释。操作对象不同在中表示文档节点属性，而则表示对象属性。函数主要依赖的是对象的和两个方法。
操作对象不同昨天在开发的时候同事帮忙写了一小段JS代码，取数据的时候用到了以前都没用过的$(this).data("xxx")的这种形式，后来看了手册才知道在HTML5中可以对元素进行自定义属性。格式类似于data-xxx="value",然后可以用JQ中的.data()方法进行存取数据。
后来GG了一番不知怎么搜索的又发现了一个attr()和prop()区别的一些解释。
在jQuery中attr表示HTML文档节点属性，而prop则表示JS对象属性。
在jQuery中，prop()函数的设计目标是用于设置或获取指定DOM元素(指的是JS对象，Element类型)上的属性(property)；attr()函数的设计目标是用于设置或获取指定DOM元素所对应的文档节点上的属性(attribute)。
当然，在jQuery的底层实现中，函数attr()和prop()的功能都是通过JS原生的Element对象(如上述代码中的msg)实现的。attr()函数主要依赖的是Element对象的getAttribute()和setAttribute()两个方法。prop()函数主要依赖的则是JS中原生的对象属性获取和设置方式。
javascript
当然，jQuery对这些操作方式进行了封装，使我们操作起来更加方便(比如以对象形式同时设置多个属性)，并且实现了跨浏览器兼容。
此外，虽然prop()针对的是DOM元素的property，而不是元素节点的attribute。不过DOM元素某些属性的更改也会影响到元素节点上对应的属性。例如，property的id对应attribute的id，property的className对应attribute的class。
应用版本不同
attr()是jQuery 1.0版本就有的函数，prop()是jQuery 1.6版本新增的函数。毫无疑问，在1.6之前，你只能使用attr()函数；1.6及以后版本，你可以根据实际需要选择对应的函数。
设置属性值类型不同由于attr()函数操作的是文档节点的属性，因此设置的属性值只能是字符串类型，如果不是字符串类型，也会调用其toString()方法，将其转为字符串类型。
prop()函数操作的是JS对象的属性，因此设置的属性值可以为包括数组和对象在内的任意类型。
在jQuery 1.6之前，只有attr()函数可用，该函数不仅承担了attribute的设置和获取工作，还同时承担了property的设置和获取工作。例如：在jQuery 1.6之前，attr()也可以设置或获取tagName、className、nodeName、nodeType等DOM元素的property。
直到jQuery 1.6新增prop()函数，并用来承担property的设置或获取工作之后，attr()才只用来负责attribute的设置和获取工作。
★★★★★
此外，对于表单元素的checked、selected、disabled等属性，在jQuery 1.6之前，attr()获取这些属性的返回值为Boolean类型：如果被选中(或禁用)就返回true，否则返回false。
★★★★★
但是从1.6开始，使用attr()获取这些属性的返回值为String类型，如果被选中(或禁用)就返回checked、selected或disabled，否则(即元素节点没有该属性)返回undefined。并且，在某些版本中，这些属性值表示文档加载时的初始状态值，即使之后更改了这些元素的选中(或禁用)状态，对应的属性值也不会发生改变。因为jQuery认为：attribute的checked、selected、disabled就是表示该属性初始状态的值，property的checked、selected、disabled才表示该属性实时状态的值(值为true或false)。
因此，在jQuery 1.6及以后版本中，请使用prop()函数来设置或获取checked、selected、disabled等属性。对于其它能够用prop()实现的操作，也尽量使用prop()函数。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/85643.html
摘要：需求很简单的，一个非常简单的复选框的使用。与的区别复选框设置设置自定义自定义设置类型设置类型支持类型在这里温馨提示提示一下，当我们设置这个属性时，再用获取的时候，控制提示。 问题引入 昨天接到了一个活，里面有一个小需求，在写的过程中遇到了一个小问题。虽然这个问题并不是很复杂的东西，但却是一个比较细节的问题。相信不少新手前端会遇到。下面我先描述一下我这个遇到的这个需求。 showImg(...
摘要：先提出问题对于这类值是的属性，用的或方法进行读取或设置值是有区别的。因此，如果你想知道文本框的当前值，则读取。的值并不会随着的状态而作出相应改变，而会。为对象设置值的安全做法避免内存泄漏是使用。参考翻译地址的与的区别 先提出问题：对于 checked 这类值是 true/false 的属性，用 jQuery 的 attr 或 prop 方法进行 读取或设置值是有区别的。 在看 jQue...
摘要：今天研究前端的给固有属性加值是出现错误，搜索了下，找到了原因，就是中和的区别。下面和大家分享下在高版本的引入方法后，什么时候该用什么时候用它们两个之间有什么区别这些问题就出现了。关于它们两个的区别，网上的答案很多。 今天研究前端jquery的attr给固有属性加值是出现错误，搜索了下，找到了原因，就是：jquery中attr和prop的区别。下面和大家分享下： 在高版本的jquery引...
摘要：在中新加了一个方法，查看文档可以看到一句话获取在匹配的元素集中的第一个元素的属性值。这种情况适用于多选项全选和反选的情况。 在jquery1.6中新加了一个方法prop()，查看jquery文档可以看到一句话:获取在匹配的元素集中的第一个元素的属性值。 大家都知道有的浏览器只要写disabled，checked就可以了，而有的要写成disabled = disabled，checked...
阅读 938·2023-04-26 02:49
阅读 1153·2021-11-25 09:43
阅读 2525·2021-11-18 10:02
阅读 2877·2021-10-18 13:32
阅读 1252·2019-08-30 13:54
阅读 2061·2019-08-30 12:58
阅读 2972·2019-08-29 14:06
阅读 2127·2019-08-28 18:10
