码迷,mamicode.com
首页 > Web开发 > 详细

HTML数据属性 data-*

时间:2019-12-27 23:45:10      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:hello   click   document   html   mes   定义   ext   asc   dataset   

在HTML标签中定义属性,需要时可以读取属性的值,这类属性称为数据属性

定义数据属性

命名规则是data-<属性名称>

例如

<div id="message" data-text="hello,world" ></div>

<button onclick="read()">submit</button>

在JavaScript中读取

读取时通过元素的dataset.<属性名称>访问,

function read(){
    obj = document.getElementById('message');
    console.log(obj.dataset.text);
}

这样触发函数就能读取data-text的值

HTML数据属性 data-*

标签:hello   click   document   html   mes   定义   ext   asc   dataset   

原文地址:https://www.cnblogs.com/esrevinud/p/12109711.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!