Pourquoi devrais-je ajouter mes attributs personnalisés avec "data-"?

Question

Ainsi, toutes les données de l'attribut personnalisé que je devrais commencer à utiliser avec « Data- »:

<li class="user" data-name="John Resig" data-city="Boston" 
    data-lang="js" data-food="Bacon"> 
    <b>John says:</b> <span>Hello, how are you?</span> 
</li> 

quelque chose va mal se passer si j'ignore simplement cela? À savoir:

<li class="user" name="John Resig" city="Boston" 
    lang="js" food="Bacon"> 
    <b>John says:</b> <span>Hello, how are you?</span> 
</li> 

je suppose une mauvaise chose est que mes attributs personnalisés peuvent entrer en conflit avec des attributs HTML avec une signification particulière (par exemple, name), mais à part cela, est-il un problème avec l'écriture juste « example_text » au lieu de "data-example_text"? (Il ne validera pas, mais qui se soucie?)

Answer 1

Il existe plusieurs avantages pour conserver les attributs personnalisés préfixés par data- *.

1. Il garantit qu'il n'y aura pas de conflit avec les extensions HTML dans les éditions futures. C'est un problème qui a déjà été rencontré avec certains des nouveaux attributs introduits dans HTML5, où les sites existants utilisaient des attributs avec le même nom et attendaient un comportement personnalisé différent et incompatible. (Par exemple l'attribut required sur input éléments est connu pour avoir eu des affrontements sur certains sites Web populaires dans le passé)

2. Une fois que les navigateurs prennent en charge la fonction, ils fourniront une API DOM plus commode pour accéder à ces attributs à partir de scripts.

3. Ils fournissent une indication claire des attributs qui sont des attributs personnalisés et ceux qui sont des attributs normalisés. Cela aide non seulement les validateurs en leur permettant d'autoriser tout attribut avec des données * tout en effectuant une vérification d'erreur utile pour d'autres attributs (par exemple pour intercepter les fautes de frappe), mais aussi de clarifier cet aspect du code source. qui peut travailler sur un site Web après l'auteur original.

Answer 2

Selon John Resig, le but de l'ajout de ces données personnalisées attribue aux sepcs HTML5 est de permettre d'intégrer des données personnalisées en HTML tout en étant valide .

Si vous ne se soucient pas de la validation (et, comme vous l'avez dit, vos attributs personnalisés ne sont pas entrer en collision avec les attributs HTML existant comme name, id, style, etc.), alors je suppose que vous ne devez pas utiliser le préfixe data-. Mais vu que ce n'est pas un coût énorme pour écrire du code compatible et valide, je ne vois pas pourquoi vous ne le feriez pas.