Сréation d'un élément img et ajout à dom n'a pas de terminaison

Question

J'ai déjà une structure DOM assez compliquée et je voudrais éliminer la possibilité d'éléments d'image non terminés causant des problèmes.

En regardant le cas le plus simple:

var prettyPicture = document.createElement("img"); 
//Add properties... 
container.appendChild(prettyPicture); 

fonctionne très bien, mais quand j'insepct dom je vois l'élément img sans slash de terminaison tel que <img/>

<img id="iamge-6816177" src="_site/images/detail/6816177.png"> 

Aucun problème dans simple vue de mise en page, mais quand je regarde une vue avec des tonnes de ces éléments, ceux aléatoires, même des images similaires dans les mêmes nœuds parents ne rendent pas, même si leurs nœuds sont dans l'inspecteur dom. Une terminaison manquante provoquerait-elle des problèmes avec l'arborescence?

Answer 1

La balise fermante d'un élément img est entièrement facultative - cela ne vous posera aucun problème dans les navigateurs. En fait, en HTML5, vous n'êtes pas censé inclure les /> dans les éléments img. En outre, ce que vous voyez lorsque vous inspectez le DOM est la façon dont votre inspecteur choisit d'afficher les éléments sans balise de fermeture - vous pouvez être sûr que createElement() et appendChild() génèrent du HTML valide, car vous travaillez directement avec le DOM. plutôt que de fournir du texte pour l'analyse du navigateur dans les objets DOM.

Answer 2

Si vous êtes préoccupé par

<img id="iamge-6816177" src="_site/images/detail/6816177.png"> 

au lieu de

<img id="iamge-6816177" src="_site/images/detail/6816177.png"/> 

alors il n'y a pas d'inquiétude: les jours du XHTML douloureux ont pris fin et HTML5 confirme que vous ne devriez pas écrire XML des étiquettes à fermeture automatique de style.

De the spec:

éléments Void ont seulement une balise de début; les balises de fin ne doivent pas être spécifiées pour les éléments vides.

[...]

éléments Void

zone

, base, br, col, commande, d'intégration, hr, img, entrée, keygen, lien, méta, param, source, track, wbr

Il est déconseillé d'encombrer votre code avec des balises de fin. Le HTML n'est pas XHTML.

Answer 3

De http://www.w3schools.com/tags/tag_IMG.asp

En HTML le <img> balise n'a pas d'étiquette de fin.

En XHTML, la balise <img> doit être correctement fermée.

Dans tous les cas, le navigateur ne s'en souciera pas.

Answer 4

Cela ne devrait pas causer de problèmes. Je voudrais juste l'ignorer car cela ne nuira pas à la conformité de w3.org car les éléments DOM sont générés dynamiquement.