jQuery 第13章 获取attr()与prop()属性值的方法及区别介绍 jQuery 第13章 获取attr()与prop()属性值的方法及区别介绍

2022-07-18

①、问题来源

在高版本的 jquery 引入 prop 方法后,什么时候该用 prop?什么时候用 attr?它们两个之间有什么区别?这些问题就出现了。

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

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

②、举例

https://file.lulublog.cn/images/3/2022/08/XdeZeuU0WrDWWPDFfEuswUDSqPrd0W.png

A、像 checkbox,radio 和 select 这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用 prop 方法去操作才能获得正确的结果。

$("#chk1").prop("checked") == false
$("#chk2").prop("checked") == true

如果上面使用attr方法,则会出现:

$("#chk1").attr("checked") == undefined
$("#chk2").attr("checked") == "checked"

B、而自定义属性 data-name 需要使用 attr

$("#chk1").prop("data-name") == undefined

如果上面使用attr方法,则会出现:

$("#chk1").attr("data-name") == "hello"

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开微信扫一扫,即可进行扫码打赏哦

阅读 582