data-前缀就被称为data属性,其可以通过脚本进行定义,也可以应用CSS属性选择器进行样式设置。数量不受限制,在控制和渲染数据的时候提供了非常强大的控制。
举例
<body>
<div class='showBox'></div>
<input type="button" value='贾玲' age=11 skill='西兰花' data-name='jl'>
<input type="button" value='高圆圆' data-name='gyy'>
<input type="button" value='张杰' data-name='zj'>
</body>
<script>
var buttonlis = document.querySelectorAll("input");
//遍历
for(var i = 0; i < buttonlis; i++){
buttonlis[i].onclick = function(){
console.log(this.data['name']);
//也可以这样写
console.log(this.data.name);
}
}
</script>