78 votes

Et si les attributs HTML personnalisés ne sont pas du XHTML valide ?

Je sais que c'est la raison pour laquelle certaines personnes ne les approuvent pas, mais est-ce vraiment important ? Je pense que la puissance qu'ils procurent, en interagissant avec JavaScript et en stockant et envoyant des informations depuis et vers le serveur, l'emporte sur le problème de la validation. Est-ce que quelque chose m'échappe ? Quelles sont les ramifications d'un HTML "invalide" ? Et une DTD personnalisée ne les résoudrait-elle pas de toute façon ?

76voto

SpliFF Points 21945

La ramification est que le w3c arrive dans 2, 5, 10 ans et crée un attribut avec le même nom. Maintenant, votre page est cassée.

HTML5 va fournir un type d'attribut de données pour les attributs personnalisés légaux (comme data-myattr="foo"). Vous pourriez donc commencer à utiliser ce type d'attribut dès maintenant et être raisonnablement à l'abri des futures collisions de noms.

Enfin, vous oubliez peut-être que la logique personnalisée est la raison d'être de l'attribut class. Bien qu'il soit généralement considéré comme un attribut de style, il s'agit en réalité d'un moyen légal de définir des méta-propriétés personnalisées sur un élément. Malheureusement, vous êtes essentiellement limité aux propriétés booléennes, c'est pourquoi HTML5 ajoute le préfixe data.

BTW, par "fondamentalement booléen", je veux dire en principe. En réalité, rien ne vous empêche d'utiliser un séparateur dans le nom de votre classe pour définir des valeurs personnalisées ainsi que des attributs.

class="document docId.56 permissions.RW"

22voto

DrParanoia Points 211

Oui, vous pouvez légalement ajouter des attributs personnalisés en utilisant "data".

Par exemple :

<div id="testDiv" data-myData="just testing"></div>

Après cela, il suffit d'utiliser la dernière version de jquery pour faire quelque chose comme ça :

alert($('#testDiv').data('myData'))

ou pour définir un attribut de données :

$('#testDiv').data('myData', 'new custom data')

Et comme jQuery fonctionne dans presque tous les navigateurs, vous ne devriez pas avoir de problèmes ;)

mise à jour

  • data-myData peut être converti en data-mydata dans certains navigateurs, pour autant que le moteur javascript soit concerné. Il est préférable de le garder en minuscules tout le temps.

10voto

Alohci Points 30645

La validation n'est pas une fin en soi, mais un outil à utiliser pour détecter rapidement les erreurs et réduire le nombre de problèmes mystérieux de rendu et de comportement auxquels vos pages Web peuvent être confrontées lorsqu'elles sont utilisées sur plusieurs types de navigateurs.

L'ajout d'attributs personnalisés n'affectera pas ces problèmes aujourd'hui, et il est peu probable qu'il en soit ainsi à l'avenir, mais comme ils ne sont pas validés, cela signifie que lorsque vous évaluerez le résultat de la validation de votre page, vous devrez choisir soigneusement entre les problèmes de validation qui sont importants et ceux qui ne le sont pas. Chaque fois que vous modifiez votre page et la revalidez, vous devez répéter cette opération. Si votre page est entièrement validée, vous obtenez un beau message vert PASS, et vous pouvez passer à l'étape suivante du test, ou à la prochaine modification à apporter.

8voto

Ionuț G. Stan Points 62482

J'ai vu des personnes obsédées par la validation faire des choses bien pires/étranges que d'utiliser un simple attribut personnalisé :

<base href="http://example.com/" /><!--[if IE]></base><![endif]-->

À mon avis, les attributs personnalisés n'ont pas vraiment d'importance. Comme d'autres l'ont dit, il peut être bon de surveiller les ajouts futurs d'attributs dans les normes. Mais maintenant nous avons des attributs data-* dans HTML5, donc nous sommes sauvés.

Ce qui compte vraiment, c'est que les balises soient correctement imbriquées et que les valeurs des attributs soient correctement citées.

J'utilise même des noms de balises personnalisés (ceux introduits par HTML5, comme header, footer, etc), mais ceux-ci posent des problèmes dans IE.

À propos, je trouve souvent ironique la façon dont tous ces zélateurs de la validation s'inclinent devant les astuces astucieuses de Google, comme les téléchargements d'iframe.

7voto

Kirtan Points 11022

Au lieu d'utiliser des attributs personnalisés, vous pouvez associer vos éléments HTML aux attributs en utilisant JSON :

var customAttributes = { 'Id1': { 'custAttrib1': '', ... }, ... };

Et pour ce qui est des ramifications, voir La réponse de SpliFF .

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X