关于html5中自定义属性的介绍-木庄网络博客

本文摘自PHP中文网，作者V，侵删。

定义

H5为我们提供了以 "data-" 为前缀定义需要的属性即可设置自定义属性。

1 2	`<div` `id="box1"` `data-name="Musk"></div>` `<div` `id="box2"` `data-full-name="Elon Musk"></div>`

（推荐教程：H5教程）

获取

使用H5自定义属性对象dataset来获取

let box1 = document.getElementById('box1');
let box2 = document.getElementById('box2');
  
box1.dataset.name // Musk
box2.dataset.fullName // Elon Musk (驼峰)
  
box1.getAttribute('data-name') // Musk
box2.getAttribute('data-full-name') // Elon Musk

设置

let box1 = document.getElementById('box1');
let box2 = document.getElementById('box2');
  
box1.dataset.name = '马斯克'
box2.setAttribute('data-full-name', '埃隆 马斯克')

相关视频教程推荐：html5视频教程

以上就是关于html5中自定义属性的介绍的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

h5虚拟键盘挡住输入框怎么办

HTML5中在可拖动元素或选取的文本放置在目标区域时触发的事件ondrop

HTML5的深入了解

全面解析HTML5的文档结构和新增标签

关于html中<label>标签的for属性的详细分析

HTML5标准学习-doctype头部分析

HTML5页面rem布局适配方法详解

HTML5 高级教程--拖放 api 实现拖放排序

HTML5是h5吗