jQuery——元素特性、属性、数据操作

本文深入探讨了HTML元素的特性(attributes)与属性(properties)的区别与联系,详细讲解了如何使用JavaScript和jQuery来操作这两种不同类型的属性,并提供了实用的操作指南。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

特性(attributes)和属性(properties)


特性(attributes)的值,字符串。

属性(properties)的值,字符串、布尔类型、数字、对象。



区别Tips


特性(attributes)


html里面常用到的id、class、title、align等等。

所以只要是在html文档里面出现的属性,都可以使用特性(attributes)操作的方法去操作。


属性(properties)


Property是这个DOM元素作为对象,其附加的内容,例如childNodes、firstChild等等。



联系


常用的Attribute,例如id、class、title等,已经被作为属性(property)附加到DOM对象上,可以和Property一样取值和赋值。

但是自定义的特性(attribute),就不会有这样的特殊优待。


实在话


HTML元素的固有属性,使用属性(property)方法

HTML元素自定义的DOM属性,使用特性(attribute)方法

属性也好,特性也罢,值为字符串以外的形式,使用属性(property)方法



Javascript操作特性和属性


JS设置特性值

setAttribute( )  设置

getAttribute( )  获取



JS设置属性值

 .特性名 = '特性值'  设置

 .特性名            获取



jQuery操作特性和属性


特性(attributes)


获取特性值

attr(属性名)

注意,如果是class,需要写成className。


设置特性值

    attr(属性名,属性值)         一次一个

    attr({属性名:属性值,...})   一次多个



删除特性

    removeAttr(属性名)  如果多个,用空格隔开


属性(properties)


获取属性值

prop(属性名)

注意,如果是class,需要写成className。


设置属性值

    prop(属性名,属性值)         一次一个

    prop({属性名:属性值,...})   一次多个



删除属性值

    removeProp(属性名)  注意,一次一个!



jQuery操作数据


存取数据值

data(特性名)       读取

data(特性名,数据)    储存


补充


读取

优先访问通过data()方法设置的值。

如果没参数,会返回所有的结果。


储存

数据的类型会保存下来,如果存进去的是一个对象,返回的也是一个对象。


删除数据

removeData('特性名')   


补充
  1. 加空格或者变成一个数组,可以删除多个

  2. 如果无参数,就会删除全部,只剩html里设置的特性。

  3. 这种方法不对HTML结构做出改变。


检测有无数据

jQuery.hasData(dom元素)

注意,是dom元素,不是jQuery对象!

补充

它只检测jQuery里有没有添加data,HTML里的不算数。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值