自定义属性data-以及dataset的使用

最新推荐文章于 2023-04-11 15:03:44 发布
最新推荐文章于 2023-04-11 15:03:44 发布
阅读量847 收藏 3
点赞数
分类专栏： HTML5基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41257129/article/details/104278423
版权
前面的话

HTML5规定可以为元素添加非标准的属性，但要添加前缀 data- ，目的是为元素提供与渲染无关的信息，或者提供语义信息。这些属性可以任意添加、随便命名，只要以 data- 开头即可。

如何使用

添加data-属性，-后面自定义：
在这里插入图片描述
添加了自定义属性之后，可以通过元素的 dataset 属性来访问自定义属性的值：
在这里插入图片描述

crazy的蓝色梦想
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Html5之自定义属性(data-,dataset)
01-19
定义 ...使用H5自定义属性对象dataset来获取 let box1 = document.getElementById('box1'); let box2 = document.getElementById('box2'); box1.dataset.name // Musk box2.dataset.fullName // Elon
HTML5的自定义属性data-*详细介绍和JS操作实例
09-28
总结来说，`data-*`自定义属性和`dataset`属性是HTML5提供的强大工具，它们使得在HTML中存储和管理数据变得简单而灵活，同时也方便了JavaScript对这些数据的操作。在实际开发中，它们可以用于实现诸如用户状态存储、...
sessionStorage 会话存储
gaoyan426926的博客
12-07 184
sessionStorage ●叫：会话存储 ●也是把数据存到浏览器 ●特点：只要一关页面，那么数据就没了 ●除了这个特点以外，其他的跟localStorage 都是一样的 ●可以把它理解为是一个 短命版 的 localStorage ●它如果在当前页面里刷新了或跳转了，那么数据还在 ○应用场景：可以做页面传值 自定义属性 ● 标签，天生自带一些属性，这种属性称之为系统属性（自带属性、标准属性） <a href="" target=""></a> ○像a标签的href和tar.
H5新增的自定义属性：data- 和dataset
qq_46325260的博客
12-25 1836
谈到自定义属性会想到哪个单词呢？ 1 .什么是自定义属性 1.1：标准属性： W3C中的标准属性，标签天生自带的属性，浏览器可以识别， 比如class id title等, 可以直接使用点语法操作 1.2 自定义属性： 由程序员自己添加的属性,在DOM对象中找不到, 无法使用点语法操作,必须使用专门的API（用于存储一些数据） 设置一个自定义属性：setAttribute（'属性名'=,'属性值'） 获取自定义属性：getAttribute（'属性名'） 删除自定义属性：removeAttrib
属性补充操作-dataset操作自定义属性-修改-新增-删除
不懂帕斯的博客
04-21 1266
01-属性补充操作-dataset操作自定义属性-修改-新增-删除 <body> <ul> <!-- li如果自带下标的话：用起来就方便了 --> <li data-index="10" class="item">隔壁老王1</li> <li data-index="1" class="item">隔壁老王2</li> <li data-index
tensorflow之dataset详解
kangshuangzhu的博客
08-20 8481
dataset是什么？ Dataset可以看作是相同类型“元素”的有序 列表。在实际使用时，单个“元素”可以是向量，也可以是字符串、图片，甚至是tuple或者dict。Dataset是google点名建议的读取数据的方式，所以在tf使用中有很重要的地位。 这个描述其实已经描述了dataset，他是一个可迭代对象，而且是有序的，而且每个元素的类型相同。在工作中为了方便理解，我一般把它看作java中的List<T>，即声明了泛型的有序集合List。从python的角度看的话，就是规定了所有元素类
HTML5_自定义数据类型
荆莿鸟
07-30 612
HTML5_字符集属性 /* HTML5规定可以为元素添加非标准的属性，但是要添加前缀data-，目的是为元素提供与渲染 无关的信息，或者提供语义信息。这些属性可以任意的添加随意命名，只要以data-开头即可。 来看一个例子。 添加自定义属性后，可以通过元素的dataset属性访问自定义的属性的值。dataset属性的值是 DOM
HTML5自定义属性前缀data-及dataset的使用方法(html5 新特性)
09-27
主要介绍了HTML5自定义属性前缀data-及dataset的使用方法(html5 新特性),需要的朋友可以参考下
dataset和data set的区别
qq_41778335的博客
03-11 1万+
dataset和data set的区别区别结论 参考网站：https://english.stackexchange.com/questions/2120/which-is-correct-dataset-or-data-set?answertab=active#tab-top 区别 在写英语论文的时候会遇到“数据集”这一词语，一些英文论文使用dataset，还有一些使用的data set。采用d...
HTML5中的数据集dataset和自定义属性data-*
Wang的专栏
04-24 4913
在html5中可为所有元素添加一种自定义的属性，这种属性的前缀以data-开头，比如：data-name,目的是为元素提供与页面渲染无关，但与dom元素强相关的属性。添加完自定义属性后我们可以通过元素的dataset属性来访问其值。dataset与getAttribute/setAttribute的对比 在此之前的访问属性的方式我们用getAttribute/setAttributehtml 结构：
JS获取自定义属性data值
热门推荐
kongjunchao159的博客
08-06 5万+
var tree = document.getElementById("tree"); //getAttribute()取值属性 console.log(tree.getAttribute("data-leaves")); console.log(tree.getAttribute("data-plant-height")); //setAttribute()赋值属性 tree.setA
PyTorch 入门实战（三）——Dataset和DataLoader
qq_38607066的博客
08-05 3万+
目录 文章目录一、概念二、Dataset的创建和使用三、DataLoader的创建和使用四、将Dataset数据和标签放在GPU上（代码执行顺序出错则会有bug）五、Dataset和DataLoader总结 一、概念 torch.utils.data.dataset这样的抽象类可以用来创建数据集。学过面向对象的应该清楚，抽象类不能实例化，因此我们需要构造这个抽象类的子类来创建数据集，并且我们还...
如何得到html页面中dataset中的data-*属性，模态框借此进行参数传递
nb7474的博客
01-12 6125
今天在利用bootstrap实现一个跳出模态框的小功能的时候，想要进行参数的传递，以前是通过按钮绑定onclick事件，跳出模态框的同时，给模态框中的标签进行值传递。页面效果如下： 今天便尝试了一下bootstrap模态框自带的事件进行参数传递。 在模态框中有如下事件：1.show.bs.modal ：show 方法调用之后立即触发该事件。如果是通过点击某个作为触发器的元素，则此元素可以通过事件
js使用dataset方法获取自定义属性
weixin_44509418的博客
04-11 1625
原生js使用dataset方法获取自定义属性值
在JS中使用dataset获取自定义属性注意事项
qq_44960253的博客
06-20 3561
在JS中获取自定义属性的注意事项 参考链接 HTML5 中添加了 data-* 的方式来自定义属性，实际上就是在自定义属性名前加上前缀data- 即可，使用这样的结构可以进行数据存放。使用data-* 可以解决自定义属性混乱无管理的现状。 一个自定义一旦加上了前缀 data- ，那么在 JS 中就可以通过 elementNodeObject.dataset拿到这个属性，显然 dataset 是 attribute 集合的一个子集。 使用 dataset 获得自定义属性值注意事项 直接使用 .操作符即
H5自定义属性的获取方式以及dataset
一个小白，博文源于浏览各个大佬所得，感谢行业大佬们！
09-18 618
H5自定义属性的获取方式以及dataset
[JavaScript]_[初级]_[使用HTMLElement.dataset快速读写自定义属性]
Tobey(我是机器人)
11-20 509
1. 在开发前端页面时，一般会在某些元素上增加自定义的属性来存储额外的数据。比如图片元素``上增加`big`和`small`属性来存储大图片和小图片，当点击某个按钮时可以通过`JavaScript`来控制切换大小图片。那么这些自定义的属性如何读写？
HTML5新特性dataset的使用方法
EmotionComputer
10-21 2764
这篇文章主要介绍了HTML5自定义属性前缀data-及dataset的使用方法(html5 新特性),需要的朋友可以参考下: HTML5规定可以为元素添加非标准的属性，但要添加前缀 data- ，目的是为元素提供与渲染无关的信息，或者提供语义信息。这些属性可以任意添加、随便命名，只要以 data- 开头即添加了自定义属性之后，可以通过元素的 dataset 属性来访问自定义属性的值。 <!DOCTYPE html> <html lang="en"> <head> &.
自定义属性的基础用法
的博客
10-18 278
自定义属性的用法（清晰明了）
dom 自定义属性 data
最新发布
05-27
在上面的例子中，我们首先使用 `querySelector()` 方法获取了一个 `div` 元素，然后通过访问该元素的 `dataset` 属性来获取和修改它的自定义属性的值。 需要注意的是，属性名中的连字符 `-` 在 JavaScript 中会被...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值