jQuery Data 属性

最新推荐文章于 2023-09-26 13:41:11 发布
最新推荐文章于 2023-09-26 13:41:11 发布
阅读量851 收藏
点赞数
文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_56107214/article/details/116258312
版权
本文介绍了HTML5的新属性data-*，用于存储自定义数据，提高页面交互体验。讲解了jQuery Data的相关语法，包括如何使用data-*属性写入和获取元素的自定义数据，以及removeData()方法用于删除已存储的数据。
摘要由CSDN通过智能技术生成

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术： MVC
作者：林松杰
撰写时间：2021/4/29

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

jQuery Data 属性

简介：data-* 属性为移动设备创建“对触摸友好的”美观的外观

提示：data-* 属性用于存储私有页面后应用的自定义数据。

data-* 属性可以在所有的 HTML 元素中嵌入数据。

自定义的数据可以让页面拥有更好的交互体验（不需要使用 Ajax 或去服务端查询数据）。

data-* 属性由以下两部分组成：

属性名不要包含大写字母，在 data- 后必须至少有一个字符。

该属性可以是任何字符串

最低0.47元/天 解锁文章
海默.肖恩334
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery Mobile Data 属性
01-06
jQuery Mobile Data 属性 jQuery Data 属性 jQuery Mobile 使用 HTML5 data-* 属性来为移动设备创建更具触摸友好性和吸引性的外观。 在下面的参考列表中，粗体显示的值为默认值。 按钮 在1.4 版本以后已废弃。...
老生常谈JQuery data方法的使用
11-23
在这个例子中，`$.data` 会在 `obj` 上创建一个类似 `jQuery300082932543555993442300082932543555993442` 的属性，并将高度数据存储在内部对象的键值对中。 2. `$(selector).data(key, value)`： 这种形式的 `...
jQuery.data()和HTML5之data-属性
一世辛劳的专栏
04-15 872
$.data($('#widget_pro')[0], 'product', {"a": "test"}); $('#widget_pro').data('product', '{"product_id": 123}'); 1、jQuery之data()方法 描述：data() 方法向被选元素附加数据，或者从被选元素获取数据。 1.1、使用js原生对象 $.data(js对象
【前端】jquery获取data-*的属性值
qq_25285531的博客
09-15 1338
通过jquery获取下面data-id的值。方法二：jquery data()方法。方法三：jquery attr()方法。方法一：dataset()方法。
jQuery获取data-*属性值下面就详细介绍四种方法获取data-*属性的值
热门推荐
04-04 1万+
jQuery获取data-*属性值 下面就详细介绍四种方法获取data-*属性的值 <li id="getId" data-id="122" data-vice-id="11">获取id</li> 需要获取的就是data-id和dtat-vice-id的值 一：getAttribute()方法 const getId = document.getElementById('getId'); // //getAttribute()取值属性 console.log(get..
Jquery data-属性的获取与使用
我有一个魔盒的博客
11-09 2025
设置自定义属性：data-test。Jquery获取属性值方式。
实测jquery data()如何存值
01-21
但jQuery究竟是添加了一个怎样特殊的属性,目前我还没研究, 但我记得是可以通过jQuery的data(“xxx”)方法取HTML标签上的data-xxx属性的值的. 测试及结果如下： 代码如下: var $demo1 = $(“#demo1”); $demo1.data...
方便打印的jQuery mobile data属性
12-12
本文主要关注jQuery Mobile中的一个关键特性——data属性，这些属性用于定制和增强UI元素的功能和外观，使其更适合打印和学习。 首先，我们来看`data-role="button"`属性，它用于将HTML元素转化为jQuery Mobile的...
使用jQuery获取data-的自定义属性
11-23
要使用jQuery获取这个"data-name"属性的值，通常可以使用`.attr()`方法。然而，上述代码展示了一个名为`jQuery.fn.dataset`的扩展函数，它提供了一种更便捷的方式来处理"data-"属性。这个函数允许我们更灵活地获取或...
jquery中“data-*”说明
weixin_42484330的博客
03-18 714
Jquery是一款封装的很好的javascript框架，极大的简化了javascript编程，并且抑郁学习，缩短了程序员入门的时间。但是任何一门技术都不是随随便便可以精通的，世界上也没有100%完美的产品，更何况是代码呢！程序有些地方的漏洞直到真正用的时候才能体现出来。 刚开始接触前端的时候，根本不知道“data-*”属性，每次遇到事件传值的时候，返回页面在传值的...
用JS或jQuery读写HTML元素的data-*属性
wuyujin1997的博客
05-21 1439
Intro HTML5新增了data-*属性。 用jQuery读写data-*属性 jQuery API data(key, value) data(obj) Code 首先，在<head>中引入jQuery依赖(CDN或本地依赖)： <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js">...
使用data()往jq对象身上赋属性
weixin_44432032的博客
10-21 206
data()，往jq对象身上赋属性（这个不动标签的属性），当借用标签的属性的的时候，推荐使用data()。 $('h1').each(function(i){ //这里的i是从0开始的,也就是元素的下标 $(this).data({'num':i}); }); $('h1').click(function(){ $(this).html($(this).data(num)); }); ...
jQuery中的data()方法
qq_41818857的博客
03-06 887
jQuery中的data()是一种缓存机制： 向被选元素附加数据，或者从被选元素获取数据 1、如何附加： $(元素").data(“aa”,true); 2、如何获取： $(元素").data(“aa”); ...
关于jquery中data()的问题
yzyblog的博客
11-20 1218
jQuery中data（）解释为可以获取，设置元素自定义的属性，但是尽量不用data（）方法去获取元素的自定义属性;因为会有一些问题。 &lt;div class="div" data-id="1"&gt;&lt;/div&gt; &lt;script&gt; var id = $(".div").data("id"); //1 $(".div&qu
jq data-赋值
weixin_42873786的博客
09-09 1226
jq data-赋值 $('#data').attr('data-id',123) //取值attr('data-id')//取值赋值自身$(this).attr()
jQuery-data方法
凡事预则立，不预则废
06-08 727
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的三种用法
最新发布
qq_42690512的博客
09-26 871
/ 就是把obj换成jquery对象这么简单。
jquery获取data-*属性值
怎奈你何的博客
08-23 3107
jQuery data属性
jquery添加属性
07-28
下面是一个示例，演示如何使用 jQuery 添加一个 `data-` 开头的自定义属性到一个元素上： ```html <!DOCTYPE html> <script src="https://cdn.jsdelivr.net/jquery/3.5.1/jquery.min.js"> ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值