HTML data 元素

html-css09

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元素