J'utilise Firefox 3.5. Mon doctype est XHTML 1.0 Strict. Disons que je veux insérer une image dans un div avec l'identifiant "foo"; alors je pourrais essayer:Manipulation DOM XHTML avec jQuery
var foo = $('#foo');
foo.html('<img src="bar.gif" />');
Ceci ajoute en effet l'image. Mais j'ai remarqué que cela provoquait un comportement bizarre plus tard dans le document, que je soupçonnais être dû à la rupture de XHTML. Effectivement, en utilisant l'outil Web Developer pour Firefox, j'ai vérifié la source produite et a été horrifié de constater que, après l'exécution du script, j'ai:
<div id="foo"><img src="bar.gif"></div>
D'où vient le slash sur la balise img go !? Autour de la recherche, je trouve que ce n'est pas un problème spécifique jQuery: Le code JavaScript pur
document.getElementById('foo').innerHTML = '<img src="bar.gif" />';
produit les mêmes résultats. Donc qu'est ce que je devrais faire? Je dois souligner que l'utilisation de la forme développée
<img src="bar.gif"></img>
ne modifie pas le résultat. Comment puis-je insérer du code XHTML strictement valide dans mon document avec JavaScript?
Il s'est avéré que le comportement étrange que j'observais était sans rapport. Mais lhnz a absolument raison quant au type MIME. Il s'avère que, lorsque text/html est utilisé, Firefox supprime les barres de fermeture inutiles en interne, de sorte que la source générée par Web Developer reflète cela. Morale de l'histoire: Serve application/xhtml + xml aux navigateurs qui le supportent, et text/xhtml au reste. –