11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

je tombe sur un truc bizarre et je vous en fait par au cas où vous pourriez m'en dire plus.

Ça se passe sur FireFox et IE et pas sur Chrome de ce que j'ai pû tester pour l'instant.
Je commence par ajouter un element <script></script> dans ma apge afin de chager un script dynamiquement :
var h = document.getElementsByTagName("head")[0];
var s = document.createElement('script');
s.type = 'text/javascript';
s.setAttribute('src', 'test.js');
h.appendChild(s);


Mon fichier test.js est très simple :
document.write('<div id="madiv" style="position:relative;padding:1em;border:solid 2px red;"></div>');


Ca, normalement ca plante chez vous aussi.

Sauf si :
* soit j'ajoute un alert('ok'); après h.appendChild(s); dans ma page.
* soit si au lieu d'utiliser write();, j'utilise
var c = document.createElement('div');
c.setAttribute('id', 'madiv');
c.setAttribute('style', 'position:relative;padding:1em;border:solid 2px red;');
document.body.appendChild(c);
dans mon fichier .js

Est-ce que vous êtes déjà tombé sur un truc pareil ? Si oui est-ce que vous y avez compris quelquechose ?

Merci
Modifié par dhjapan (22 Oct 2010 - 09:31)
Ce n'est pas bizarre, c'est tout à fait normal.

Document.write a un comportement particulier :
* Si le document est en cours de chargement, document.write écrit dans le document existant
* Si le document est complètement chargé, alors document.write crée un nouveau document avant d'écrire.

Etant donné que ton script est exécuté bien après que le document ait été chargé, c'est la deuxième alternative qui se produit.

La solution est simple: on n'utilise plus document.write. Tu peux jeter cette fonction aux oubliettes, utilise plutôt le DOM, c'est beaucoup plus propre et beaucoup plus standard.
Ah tiens je pensais pas que le javascript pouvait s'éxecuter sur un document qui soit encore en cours de chargement.

En tout cas merci beaucoup pour ces explications.
[
a écrit :
Ah tiens je pensais pas que le javascript pouvait s'éxecuter sur un document qui soit encore en cours de chargement.

C'est le cas des instructions qui sont hors de toute fonction. Elles sont exécutées dès le moment où le fichier est chargé, ce qui arrive en principe bien avant que le document ne soit complètement chargé et que document.onload ne soit exécuté.

Là ce que tu fais n'est pas pareil, tu le charges avec le DOM, ce qui implique nécessairement puisque tu l'utilises que le DOM soit totalement chargé.

Par exemple si tu mets un script directement dans le body et que dans ce script tu mets un document.write, tu pourras observer le premier comportement que j'ai indiqué. IL fut un temps où les services de compteurs de visites tiers procédaient de cette façon... mais aujourd'hui c'est un peu dépassé comme principe.