11548 sujets

JavaScript, DOM et API Web HTML5

Salut à tous,

Je me heurte à un ecueil dans la programmation de mon site web : Je dois insérer un fragment de html fourni sous forme de chaine variable dans ma page. La fonction innerHTML me paraissait idéale, sauf qu'elle n'est pas standard et elle ne fonctionne pas correctement en XHTML avec Firefox 1.0.

Je me suis donc mis en tête de faire du 100% DOM qui a l'avantage d'être relativement crossbrowser en codant une fonction html2dom(sString).
Cette fonction prend en entrée une chaine html et construirait un node équivalent en retour. Les fonctions employées tournent autour de document.createElement(), node.appendChild() etc...

Mais bon j'avoue que je me casse les dents : J'ai pressenti l'usage de recursivité, de regexp, mais c'est trop dur pour moi là Smiley langue

Quelqu'un de plus doué se sent-il de se lancer ?

Merci d'avance !
Modifié par TopperH (29 Aug 2006 - 11:39)
Pourtant, innerHTML fonctionne partout... en tout cas IE et ff.. du moins je n'ai jamais eu de problèmes avec.

Je crois bien qu'il existe dans le niveau 2 ou 3 du DOM une manière d'importer des données à partir d'un fragment d'HTML... mais je n'en sais pas plus car je n'ai jamais utilisé.

JE ne sais pas où en est le support du DOM level 2 et 3 pour les navigateurs standards, par contre ce qui est sûr c'est qu'IE n'est pas compatible. Par contre aucune contrindication à innerHTML pour IE5+.
salut

"TopperH" a écrit :
Je dois insérer un fragment de html fourni sous forme de chaine variable dans ma page


hmm... d'où vient la chaîne? le contenu "html" ne correspond-t-il pas à un objet du dom de ce document?
Modérateur
Salut,

A priori, il te faudra passer par la méthode document.createDocumentFragment(). Smiley smile
Alors quelques précisions :

- InnerHTML ne fonctionne qu'en lecture seule dans un document XHTML avec Firefox 1.0. Firefox 1.5 corrige cela mais je ne peux ignorer mes visiteurs qui n'ont pas mis à jour leur navigateur.

- Le fragment HTML provient d'une requête AJAX, donc d'un document externe. La méthode createDocumentFragment souffre semble t-il d'incompatibilités avec IE.
Non c'est un fichier texte qui me fournit la chaine html.

Quant à createDocumentFragment, j'ai essayé de l'employer sans succès avec IE, par ailleurs un des commentaires sur cette page semble indiquer que ça ne fonctionne pas mieux avec Firefox 1.0 pour les mêmes raisons que innerHTML Smiley confus
avec responseText, tu ne pourras pas utiliser de méthodes dom;
et DocumentFragment n'a plus de sens;

retente d'affecter le contenu par innerHTML, en prenant ton temps Smiley cligne
Modérateur
Salut,

Je n'ai pas le temps de m'y pencher mais document.createDocumentFragment() fonctionne parfaitement avec Firefox et IE; je m'en suis déjà servi plusieurs fois dans mes scripts.

Javatwister a écrit :
avec responseText, tu ne pourras pas utiliser de méthodes dom;
Pourquoi ? Je ne vois pas le problème...
Javatwister a écrit :
avec responseText, tu ne pourras pas utiliser de méthodes dom;
et DocumentFragment n'a plus de sens;

retente d'affecter le contenu par innerHTML, en prenant ton temps Smiley cligne


J'ai pris tout mon temps et c'est tout vu Smiley cligne Firefox 1.0 n'a accès à innerHTML qu'en lecture dans les documents XHTML, pas en écriture, c'est un fait. Ca a été corrigé dans la v1.5, mais beaucoup de visiteurs sont encore en v1.0. D'autre part je m'astreins à des méthodes standard sur mon projet, donc pas de innerHTML pour moi Smiley smile

Bon j'ai finalement décidé de contourner le problème : Je reformatte ma requete en XML et passe en responseXML au niveau AJAX :Ainsi je peux inclure mon fragment XHTML directement dans la réponse (ben oui c'est du XML après tout) et le choper directement à l'aide de méthodes DOM, sans innerHTML. finalement c'est compatible avec tout et c'est plus propre je pense. Merci à tous !
Modifié par TopperH (29 Aug 2006 - 11:41)
Ok désormais avec cette dernière méthode je rencontre un nouveau problème bizarre qui est lié aux CSS, pour ceux que ça interesse j'ai posté le détail dans le forum indiqué :

ICI
Salut, et bonne année 2007

TopperH, j'ai vu que tu avais trouvé la solution pour rendre compatible innerHTM sous firefox. Cela fait environ un moi que j'ai stoppé mon développement web, car j'ai été démotivé a cause de cette incompatibilité. Aujourd'hui je tombe sur une personne (toi) qui a trouvé une solution à ce problème. Pourais tu m'aider en me donnant au moins un exemple de ton code, stp?
Je fais du Ajax mais je sais faire le minumun, c'est à dire mettre à jour une div en passant par Ajax et par l'élément :
divView.innerHTML= xhr.responseText;

Afin de mettre à jour une div sans passer par responseText, mais plutot par responseXml, peux-tu me donner un lien vers un tuto pour m'expliquer cela, car je peine à comprendre.

Merci beaucoup pour ton aide
Modérateur
Salut,

Juste un petit mot pour dire qu'à ma connaissance :

- innerHTML est compatible avec Firefox et IE... Seul IE 5.2 Mac est buggué.
( http://www.quirksmode.org/dom/w3c_html.html )
- createDocumentFragment est compatible avec Firefox et IE... Seul IE5 windows et IE 5.2 Mac sont buggués.
( http://www.quirksmode.org/dom/w3c_core.html )
- pour pouvoir se servir de responseText, on peut l'évaluer ou mieux, se servir du parseur JSON ( http://www.json.org/js.html )... si on se sert de JSON, bien sûr.

Je ne vois pas où il est question d'incompatibilités supplémentaires.

a écrit :
D'autre part je m'astreins à des méthodes standard sur mon projet, donc pas de innerHTML pour moi Smiley smile
Ce n'est pas forcémment ce que tu fais de mieux... Voir ici : http://www.quirksmode.org/dom/innerhtml.html
Hello,
koala64 a écrit :
Juste un petit mot pour dire qu'à ma connaissance :

- innerHTML est compatible avec Firefox et IE... Seul IE 5.2 Mac est buggué.
En fait, le problème que souligne TopperH existe réellement, mais seulement pour des pages servies en tant que application/xhtml+xml sous Firefox 1.0.
Modérateur
oui j'ai vu ça sur la page citée plus haut mais est-ce que TopperH ou AzertyH sont dans ce cas ? Je n'en ai pas eu l'impression...
Modifié par koala64 (06 Jan 2007 - 11:26)
koala64 a écrit :
oui j'ai vu ça sur la page citée plus haut mais est-ce que TopperH ou AzertyH sont dans ce cas ? Je n'en ai pas eu l'impression...
Oui, en effet, je ne pense pas non plus.
Ok, merci pour vos commentaires, j'étudierais cela. Aparament, reponseText marche pour les deux navigateurs, d'après ce que vous me dites. En tout cas ça m'arrangerais. Qui c'est j'ai peut être résolue mon problème. Seul l'avenir nous le dira!
AzertyH a écrit :
Aparament, reponseText marche pour les deux navigateurs, d'après ce que vous me dites.
Le débat portait plutôt sur innerHTML.

Ceci dit, responseText fonctionne a priori sur tous les navigateurs qui supportent XHR.