Definition
H5 provides us with "data-" as the prefix to define the required attributes to set custom attributes. .
<div id="box1" data-name="Musk"></div> <div id="box2" data-full-name="Elon Musk"></div>
(Recommended tutorial: H5 tutorial)
Get
Use H5 custom attribute object dataset to get
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
Settings
let box1 = document.getElementById('box1'); let box2 = document.getElementById('box2'); box1.dataset.name = '马斯克' box2.setAttribute('data-full-name', '埃隆 马斯克')
Recommended related video tutorials: html5 video tutorial
The above is the detailed content of Introduction to custom attributes in html5. For more information, please follow other related articles on the PHP Chinese website!