] ."/> ] .">

Maison >interface Web >Tutoriel H5 >Introduction aux attributs personnalisés en HTML5

Introduction aux attributs personnalisés en HTML5

王林
王林avant
2020-03-21 17:54:242807parcourir

Introduction aux attributs personnalisés en HTML5

Définition

H5 nous fournit "data-" comme préfixe pour définir les attributs requis pour définir des attributs personnalisés.

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

(Tutoriel recommandé : Tutoriel H5)

Obtenir

Utiliser l'ensemble de données d'objets d'attribut personnalisé H5 pour obtenir

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

Paramètres

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

Tutoriels vidéo associés recommandés : Tutoriel vidéo HTML5

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer