第24天 说说你对属性data-的理解
Activity
yangyl568 commentedon May 10, 2019
平时用的比较多的是 把必要数据绑定到某标签上然后,js、jquery 点击事件或者交互事件的时候 获取dataset里的属性值,便于 业务处理。
Mojitooooooooo commentedon May 10, 2019
学习中,自己用过的只有做图片懒加载的时候用data-属性存过src
hbl045 commentedon May 10, 2019
data- 属性是H5新增的自定义属性,也可以用来存储值。我个人用的不多,这个data- 属性倒是和vue中的v-bind 功能相似, 自定义属性,绑定数据。也和上面说的一样可以通过js进行获取使用
xjt31012 commentedon May 10, 2019
我都是在class id name等全部被占用了才想起来去用data-属性~
naokimidori commentedon May 10, 2019
data-*属性主要是用来储存自定义数据,所存储的属性值能够在后续js中操作调用。
18163759011 commentedon May 11, 2019
data-* 属性,我个人理解就是用来暂存非用户输入的数据,并且能在js里面使用
yxkhaha commentedon May 11, 2019
vinceyi commentedon May 18, 2019
这个不得不提一下标准出来之前的做法。html是支持自定义attribute的,当时为了给前端传数据,大家自己定义的attribute五花八门,不好跟标准区分,js取数据方式也跟标准attribute一样。人家一看这哪行啊,你们不能再这么搞了,听我说,你们都在自定义属性前加个data-前缀
tzjoke commentedon May 28, 2019
关键字dataset
DarthVaderrr commentedon Jul 4, 2019
注意一点,data-attr attr不支持驼峰命名法,只能用小写命名,被坑过很多次
Konata9 commentedon Aug 7, 2019
原本 HTML 也允许自定义
attributes
因此在早期前端,为了将数据塞在标签中,往往会采用自定义属性存放数据的方法。而
data-
便是 HTML 5 中用来存放数据的标签。使用data-*
时,需要注意,data-
之后的单词必须是小写的,但是可以用多个-
连接。而在对应的 DOM 方法中,我们可以通过ele.dataset[属性名]
进行访问。在这里的属性名可以使用驼峰(转换规则和 vue 的组件名称转换一样)。相比之前的自定义属性存放数据,使用
data-*
的方法,在数据的获取上会比较方便。参考文章:
使用数据属性
seho-dev commentedon Aug 11, 2019
首先定义一下: data-是h5对自定义标签属性拓展的知识点,可以存储自定义属性,可以通过js获取到,一般会存储业务需要的数据,和vue中的bind很类似
是暂存非用户输入的数据
vinceok commentedon Jan 15, 2020
data-*是HTML5新增的元素属性,用于存储页面或应用程序的私有自定义数据。data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。存储的(自定义)数据能够被页面的 JavaScript 中利用。
rorry121 commentedon Mar 2, 2020
使用:
8 remaining items