HTML data 元素

html-css011

HTML data 元素,第1张

data 元素表示其内容，以及值属性中这些内容的机器可读形式。Edge、Firefox 和 Safari 都支持 <data> 元素。

value 属性是必需的，其值必须以机器可读的格式表示元素的内容。 HTML 标准建议 如下：

没问题的。不过你最好就是按照“data-自定义名"的格式来进行定义。因为data自定义属性属于html5的新特性，它可以通过js进行设置和通过其名字进行索引修改元素样式。

例子：

<div id="dt" data-wq="123">html 的data自定义属性能随便修改吗？</div>

js设置:

document.getElementById('dt').dataset.new= '321'//变成了<div id="dt" data-new="231" data-wq="123"></div>

css样式设置：

<style type="text/css">

        [data-wq]

        {

            background-color: red

        }

</style>

此时元素背景为红色的了。

当然如果你不按照规定格式来自定义的话是用不到上面的方的，不过可以通过js的

getAttribute/setAttribute

方法来随意命名。

那个其实不属于正规的HTML属性，是jquery这个库专门用来寻址的一种自定属性，其他库也有类似的这种；利用它的目的是库自定义的属性，所以可以在库中更方便的区分其他HTML自带的属性，用获得的值来做的事情很多，比如data-target=id2，可以取得id2这个相关联的DOM元素