jq data属性操作的一个陷阱

最新推荐文章于 2023-11-06 13:54:02 发布
最新推荐文章于 2023-11-06 13:54:02 发布
阅读量1.7k 收藏
点赞数
分类专栏： jquery 文章标签： javascript jquery
本文分享了在使用jQuery过程中遇到的问题：通过attr()修改data-xxx属性值但实际效果未如预期。作者发现使用data()方法进行设置与获取可以避免这一问题，确保属性值正确更新。

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

今天操作元素的data-xxx属性的时候前面修改值使用了attr(),取数据用了data(),页面上看貌似改掉了,但是data函数调用的时候却还是原来的值.

后来发现修改和取得数据都用data就正常了.

以下是参考文章:

http://blog.youkuaiyun.com/chennanfei/article/details/18055671

最全面、最详细web前端面试题及答案总结
HanXiaoXi_yeal的博客
02-01 3万+
2021最全面、最详细web前端面试题及答案总结 总结不易，希望可以帮助到即将面试或还在学习中的web前端小伙伴，祝面试顺利，拿高薪！ 本章是HTML考点的⾮重难点，因此我们采⽤简略回答的⽅式进⾏撰写，所以不会有太多详细的解释。我们约定，每个问题后我们标记『✨ 』的为⾼频⾯试题 doctype的作⽤是什么？✨ DOCTYPE是html5标准⽹⻚声明，且必须声明在HTML⽂档的第⼀⾏。来告知浏览器的解析器⽤什么⽂档标准解析这个 ⽂档，不同的渲染模式会影响到浏览器对于 CSS 代码甚⾄ JavaScript
jQuery.data() 的实现方式
03-23
NULL 博文链接：https://xxing22657-yahoo-com-cn.iteye.com/blog/1042440
jQuery笔记 （一）
qw2319205chu的博客
02-26 403
jquery data()函数 一、jquery data()的作用 data() 方法向被选元素附加数据，或者从被选元素获取数据。 通过data()函数存取的数据都是临时数据，一旦页面刷新，之前存放的数据都将不复存在。 该函数属于jQuery对象(实例)。如果需要移除通过data()函数存放的数据，请使用 removeData() 函数。 二、jquery data的使用方式 1、获取附加的da...
jQuery Data 属性
Proction的博客
12-12 1222
JS中的data自定义属性
jQuery-data方法
凡事预则立，不预则废
06-08 821
HTML:<ul> <li data-person='{"name":"zhangsan1"}'>zhangsan1</li></ul> <button onclick="changePerson()">click me to change</button>JS:var $el = $("li:first"); var p = $el.data("person"); console.
jQuery.data() 函数详解
chelen_jak的专栏
12-31 974
转自：http://www.365mini.com/page/jquery-data.htm data()函数用于在当前jQuery对象所匹配的所有元素上存取数据。 通过data()函数存取的数据都是临时数据，一旦页面刷新，之前存放的数据都将不复存在。 该函数属于jQuery对象(实例)。如果需要移除通过data()函数存放的数据，请使用removeData()函数。
若依用JQ使表单里面隐藏的select提交时不传参
03-29
移除name属性也是一个有效的方法，但需要在每次显示或隐藏时处理属性，确保同步。而动态销毁元素虽然彻底，但可能增加代码复杂度，尤其是在需要频繁切换显示状态的情况下。 还需要考虑若依框架的特性。若依是基于...
JSON数据分析陷阱识别与规避：数据质量问题大揭秘
JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，广泛用于Web应用程序和数据存储。JSON数据分析涉及对JSON数据进行处理、分析和提取见解的过程。 JSON数据分析的目标是将非结构化的JSON数据转换为...
JSON数据建模陷阱大揭秘：如何规避和解决
JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，广泛用于Web开发和数据存储。JSON数据建模是将数据结构化为JSON格式的过程，以方便数据传输、存储和处理。 JSON数据建模的优点包括： - **易于...
Suinado Cash. Living proof that Zero Knowledge is not required in order to prove your knowledge. Instructions: Provided below you can find the url of a local Sui Explorer. You must connect it to the custom RPC: http://85.120.206.56:9000 Following that, you should be able to locate the Package suinado_cash at 0x253899d91a9d03d34e47368a251140634fc9cf89ade188e2f1016f5ce9102344 Your task is to generate a valid proof for the deposit made in the transaction: FcxC5Tuq4hv5WvbSdfPqPEvs165HraWqRup5fbCme8fj . The final flag should follow the format: SBC{0xaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa,0xbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb,0xcccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc,...0xzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz}
最新发布
05-03
用户提到了交易哈希FcxC5Tuq4hv5WvbSdfPqPEvs165HraWqRup5fbCme8fj，需要生成一个有效证明，并且提取最终标志，标志的格式是SBC{}。看起来用户可能是在进行某种CTF挑战或者安全相关的任务，需要从区块链交易中获取...
jQuery.data方法
nbin2008的博客
03-07 899
jQuery缓存方法
jq---data()方法的妙用
wangle_style的博客
04-03 1857
有这样一种场景：将左侧表格中的内容在点击添加的时候，右侧列表会增加相应的一列数据，然而反过来还需要点击右侧列的删除时相应的对左侧表格中的对应行操作，此时可以用jq的data()方法，在第一步点击左侧表格添加的时候向该行附加数据，然后左侧点击删除的时候根据附加的数据选择对应行！其实质是把附加数据作为标记，代码如下：// 左侧点击添加到右侧列表    $('.nowkucun_table1').on(...
jQuery data()方法怎么使用？
zy1992As的博客
11-06 632
data()方法用来在指定的元素上存取数据。数据保存在内存中，并不会修改DOM元素结构；一旦页面刷新，之前存放的数据都将被移除。在上述代码中，第3行用来获取data-index属性，属性名中不需要“data-”前缀，并且返回的结果是数字型。上述代码运行后，uname会保存到内存中，不会出现在HTML结构中。在开发者工具中查看元素，如下图所示。使用data()方法还可以读取HTML5自定义属性data-index，示例代码如下。下面我们演示通过data()方法实现数据的操作，示例代码如下。
jQuery 的 data() 与 attr() 使用，data() 为何无效？
qq_32506555的博客
02-22 2230
本文和大家分享的主要是jquery的data() 与 attr() 使用，data()无效相关内容，一起来看看吧，希望对大家学习jquery 有所帮助。 　　jQuery 的 data() 方法 　　HTML 元素可以自定义属性，一般约定以“data-”开头（你不这么约定也行，但是那样就用不到 jQuery 的 data() 了）。 　　jQuery 的 data() 可以方便取
jq选择器 常用方法总结 data数据存储
苏先生前端
10-15 1317
dom选择器$符号起步参数形式如css即可 进一步选择元素相关方法： .get() 在你选取的标签之中获取指定的那个索引选取或者属性选取并且该元素是原生dom 数组形式，故无法实现链式调用 .eq() 在选取的基础上进行筛选雷同get方法 但是他会返回一个jq对象可实现链式调用 .find() 参数和$一致进行选区dom 在前面基础结构中查找一层层递进 该方法...
jQuery 3.0 的 Data 浅析
weixin_34128839的博客
06-14 157
jQuery 3.0 在6月9日正式发布了，3.0 也被称为下一代的 jQuery 。这个版本从14年10月开始，其中发布过一次beta 版（2016/1/14,）和候选版（2016/05/20）。一路走来，颇为不易。   文章目录 Data浅析 Data在jQuery内部的使用 1.x.x 和 2.x.x 的比较   一、Data浅析 jQuery 3.0 中的 Data...
深入jQuery中的data()
汪飞的博客
03-03 997
引入 　　data函数在jQuery中看起来很不起眼, 就像沙滩上一颗平凡的沙子, 但仔细一瞅, 却惊讶的发现data是jQuery中无比重要的一环, 甚至jQuery中各种事件都基于此。 data有什么作用？ 　　在我们平时js编码过程中，我们经常会向DOM元素中添加各种自定义属性，这样有一个弊端。 　　1  假设我们在DOM元素中添加了一个属性，这个属性指向了某个js对
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值