给标签自定义属性html
程序员文章站
2022-06-09 11:17:32
...
H5为我们提供了一个data属性——“data-”前缀,可以让所有的HTML元素支持自定义属性,只要在标签里面以”data-”为前缀定义我们的自定义属性就可以用来进行一些数据的存放。
<div id="myDiv" data-attribute="value">在标签里设置H5新增的自定义属性</div>
这个data属性还可以应用在CSS中,前提是你的浏览器支持after伪类,以及content的attr属性(低版本的IE不支持):
<div id="myDiv" data-attribute="属性值">data属性应用于CSS中</div>
#myDiv{
position: ralative;
}
#myDiv:hover:after{
position: absolute;
top: 0px;
left: 0px;
content: attr(data-attribute);
color: red;
}
不用h5
<div id="myDiv" user-defined-attribute="value">在标签里设置自定义属性</div>
获取里面的值是使用getAttribute来获取自定义属性里面的值:
var myDiv = document.getElementById("myDiv");
var theValue = myDiv.getAttribute("user-defined-attribute");
上一篇: 深圳宏电笔试
下一篇: java应届生面试题库
推荐阅读