jQuery的data函数使用遇到的坑

最新推荐文章于 2023-02-14 11:14:17 发布
原创 最新推荐文章于 2023-02-14 11:14:17 发布 · 797 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#jquery #data函数 .data

本文介绍如何在HTML5中使用data-自定义属性存储数据，并通过jQuery获取这些数据。需要注意的是，虽然HTML标签不区分大小写，但JavaScript区分大小写，因此获取data-属性时应使用小写字母。

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

在HTML5的标签中可以使用data-自定义属性的形式存储数据，然后使用jQuery的data函数就可以获取该数据。

然而需要注意的是，HTML标签或属性是不区分大小写的，也就是说data-id跟data-ID是一样的。

但是JavaScript是区分大小写的，当你在标签中使用data-ID时，使用$.data("ID")就获取不到数据，因为实际上data-ID在HTML中会变成data-id(可以通过浏览器的开发者工具查看)

所以，在使用data-ID存储数据时，也要用data-id来获取数据

jQuery .data（）不起作用，但.attr（）可以
顶顶顶顶顶顶顶顶顶顶顶顶
08-17 737
标签上之前就有data-xxx，必须使用$('#xxxId').attr("data-mentId")获取。使用data()设置，必须使用data()方法获取。
JQuery坑，说说哪些大家都踩过的坑
luyaran的博客
04-25 472
1 乱用选择器 坑人指数：200 JQuery选择器调用代价很大，反复调用效率更低。应采用缓存对象的方法或采用链式调用的方式。 //错误的写法 $("#button").click(function(){ $('#list li').addClass('strong'); $('#list li').css('color', 'red'); }); //正确的写法 $("#b
jQuery那坑爹的text()
weixin_34082854的博客
09-13 163
有一段代码： var jTd = $("td:first");  jTd.text(jTd.find(":input").val()).addClass("readonly");  结果居然报告：对象不支持“addClass”属性或方法 难道 text(param) 返回的不是jQuery对象？！ 仔细想了下，想明白了，一般情况下是返回的jQuery对象，但有一种情况除外…… 假设：...
jquery坑
qq_21383977的博客
05-09 642
https://www.polarxiong.com/archives/jQuery-Ajax%E5%8A%A8%E6%80%81%E5%8A%A0%E8%BD%BD%E5%86%85%E5%AE%B9on-%E7%BB%91%E5%AE%9A%E4%BA%8B%E4%BB%B6%E6%97%A0%E6%95%88%E7%9A%84%E8%A7%A3%E5%86%B3%E6%96%B9%E6%B3...
jQuery踩坑
ym_diver的博客
08-20 506
最近工作中很多地方都使用到了Jquery，把一些踩过的坑写下来 1、jQuery全局变量的声明     全局变量的好处在于减少变量的个数，并可以在不同的函数中直接使用，在某些传值的时候很好用，但他的坏处在于占用内存较多，增加耦合性     全局变量有如下几种声明方式：     一、var + 变量名的方式在function外部声明，如果在函数内部用此方法声明的即为局部变量
jquery的data函数
03-18
`jQuery`的`data()`函数有一个内部缓存机制，当在元素上设置数据时，`jQuery`会尝试查找现有的`data-*`属性，如果找到则使用，否则才创建新的数据对象。这有助于减少内存占用，尤其是在处理大量元素时。 ### 五、`...
逐一介绍Jquery data()、Jquery stop()、jquery delay()函数(详)
11-23
首先给大家介绍jquery data()函数 jQuery中data()函数用于向被选元素附加数据，或者从被选元素获取数据。通过data()函数存取的数据都是临时数据，一旦页面刷新，之前存放的数据都将不复存在。 一、jquery data()的...
jquery自定义函数的多种方法
12-02
在jQuery中，自定义函数是开发过程中非常常见且实用的功能，可以提高代码的复用性和模块化程度。这里我们探讨几种不同的方法来实现jQuery自定义函数。 首先，我们可以直接在jQuery对象上定义方法。比如： ```...
老生常谈JQuery data方法的使用
10-21
本文将对jQuery中data方法的使用进行详细的探讨，包括$.data()和$(selector).data()两种形式，并比较了低版本与高版本之间的差异。 $.data(obj, key, value) 方法主要作用于普通的JavaScript对象。这个方法可以接受...
关于jQ data自定义属性的坑
KentKun的博客
05-08 532
关于jQ data自定义属性的坑 当data里面的属性值发生改变时 $('#test').data('name', 'hhh'); //$('#test').data('name') == 'hhh； //$('#test').attr('data-name') != 'hhh'; //等于原来的值 //无法使用 $('#test[data-name="hhh"]')获取到对象 ...
使用jQuery时应该避开的坑
10-25 187
最近在编写一个网页版Todo应用的过程中遇到一些jQuery的特性，不知道的话容易掉进坑里。 引用jQuery的script标签必须放在html文件的后部，让浏览器在将页面所有元素渲染完之后才运行jQuery脚本，否则选择器选不到写在html页面中的元素； 和上面一样的道理，用js新创建元素后，如果元素有事件绑定，不要忘记创建完再加一段绑定事件的代码； 一个元素可以绑定多个事件...
jquery first()自己踩过的坑。
CodingNoob
09-28 645
今天又一次仔细看了jq的文档，突然发现first有个坑，是自己理解错误，不知道有没有同学也遇到过，所以记录一下。<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>jquery first()踩过的坑。</title> <meta name="author" content="" /> <s
jQuery 中 data() 引发的错误
FE-阿阳的博客
02-01 1075
jQuery 中 data() 引发的错误 详情描述 jQuery 中 data()解释为可以获取、设置元素自定义的属性，但是尽量不用data()方法去获取元素的自定义属性；因为会引发一些隐形错误； 1. 只能获取到第一次赋值的属性，之后通过修改的值获取不到； 2. 如果值是string类型的数字，比如“123”，获取的时候会强转为number，123； 3. 所以建议还是使用 $(“d
jQuery入坑笔记
梧桐下的四叶草
07-04 499
以前比较散乱的学习jQuery，所以现在想要系统的学一下。这里面我是跟着学的，因为以前看过这一系列的书都感觉不错，所以现在也是对Head First系列的书充满好感。 (1)slideToggle 在这里我要实现一个点击文字就会出现图片向下滑动出现的效果，所以采用slideToggle来实现，这个的话其实就是封装了两个函数slideUp和slideDown。这两个函数会根据你使用的选择器而判断
jQuery 的 data 方法 不识别大小写
new Girl的博客
03-29 750
<button class="optionBtn" type="button" value="2" data-workState="1"></button> console.log($(this).data("workState"));//undefined console.log($(this).data("work-state"));//undefined...
jQuery中使用data()方法读取HTML5自定义属性data-*实例
fjnjxr的博客|PHP每周一贴
03-12 1047
如果你使用jQuery类库，那么你可以非常愉悦的使用jquery的data()方法存取data-* 自定义属性，方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险 主要的方法如下： .data( key, value ) .data( obj ) .data( key ) .data() 从jQuery 1.4.3起， H
jQuery中data方法遇到的bug
qq_62452129的博客
02-14 277
解决办法:不使用data方法来获取 使用jQuery的attr来获取他的属性就好了。
踩坑：使用jquery的data()方法获取不到自定义属性的值
weixin_44771007的博客
02-15 1520
<a href="" class="regBtn" data-btn="1">点击</a> <a href="" class="regBtn" data-btn="2">点击</a> <a href="" class="regBtn" data-btn="3">点击</a> <a href="...
jquery data 小写的坑
ISaiSai的专栏
12-20 1531
jquery data  后面都要转化为 小写，才能渠道 怎么会有这么大的坑？？？？？
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值