[DOM] Bug en DOM sous IE

**rekam** · 22/08/2005, 15h15

Bonjour à tous !

Je suis confronté à un gros bug pas bô de Internet Explorer. Le-dit navigateur me fait une plantée magistrale quand j'essaie de faire un .appendChild. Mais attention ! Pas n'importe quand.

Voici mes découvertes (le code ci-dessous est simplement entre les balises <html><body>ici le code</body></html>) :

Ceci fonctionne :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<script type="text/javascript">
var ob1 = document.getElementsByTagName('body')[0];
var ob2 = document.createElement('DIV');
var ob3 = document.createTextNode('fgdg');
ob2.appendChild(ob3);
ob1.appendChild(ob2);
</script>

Ceci ne fonctionne pas :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<div>
<script type="text/javascript">
var ob1 = document.getElementsByTagName('body')[0];
var ob2 = document.createElement('DIV');
var ob3 = document.createTextNode('fgdg');
ob2.appendChild(ob3);
ob1.appendChild(ob2);
</script>
</div>

Si jamais, ob1 retourne bien l'élément body. Une alert de ob1.appendChild montrera que la fonction existe. J'en déduis simplement que la balise body n'est pas accessible depuis une couche plus profonde. Notre ami Billou dira que c'est au nom de la sécurité... Moi, j'en sais rien. Mais ça m'embête (à moitié) que le site plante sous IE.

J'ai aussi testé avec en appelant un P plutot que le BODY. Alors le P, on peut le mettre n'importe où, y'a pas de problème. C'est quand même curieux, vous n'trouvez pas ?

Si les maîtres es javascript sont parmi nous, j'invoque leur pouvoir et les appelle à la rescousse !!

Rekam

**denisC** · 22/08/2005, 15h23

Envoyé par rekam

Notre ami Billou dira que c'est au nom de la sécurité... Moi, j'en sais rien. Mais ça m'embête (à moitié) que le site plante sous IE.

Les conclusions hatives, ça apporte rien de bon

Moi je dirais que monsieur IE a bien raison de refuser de faire un appendChild sur le body, alors même que tu n'as pas terminé de lire ce qui est dedans.

Tu commences le body, tu ouvre un div et là tu lui dit: "mets tout à la fin de mon body un nouvel élément div"!! Et comment il est sensé deviner ce qui viendra après?

Faisons un parallèle simple (mais éloquent):
Tu construit un immeuble. Tu en es au 24ème étage (alors que le plan en compte 154) et tu continues tranquillement de construire, et là on te dis: "arrete tout, il faut absolument que tu nous contruise tout de suite un étage supplémentaire au sommet de la tour". Tu réponds quoi?

Certainement la même chose que IE

**rekam** · 22/08/2005, 15h46

Certes, ma conclusion était hâtive, toutefois, je me permets de mettre en doute la tienne

En effet, regarde bien le code que j'ai posté. Je le met en entier, avec du code en bonus en bas :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<html>
<body>
 
<script type="text/javascript">
var ob1 = document.getElementsByTagName('body')[0];
var ob2 = document.createElement('DIV');
var ob3 = document.createTextNode('fgdg');
ob2.appendChild(ob3);
ob1.appendChild(ob2);
</script>
<p>Et voici plein de code dessous. Ce qui signifie que :</p>
<ul>
	<li>La balise body n'est pas fermée</li>
	<li>Et voilà</li>
</ul>
 
</body>
</html>

Et ça, je te jure (teste, si tu veux) ça fonctionne ! Ce n'est pas parce que la balise body n'est pas fermée qu'il y a un problème. Je suis allé plus loin dans mes tests. Voici mes résultats (toujours entre les balises <body>) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
<div id="blu">
	<script type="text/javascript">
	var ob1 = document.getElementById('blu')
	var ob2 = document.createElement('DIV');
	var ob3 = document.createTextNode('fgdg');
	ob2.appendChild(ob3);
	ob1.appendChild(ob2);
	</script>
</div>

Ci-dessus, ça fonctionne nickel. Génial, cool. Maintenant, c le code ci-dessous qui est vraiment intéressant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<div id="blu">
	<div>
		<script type="text/javascript">
		var ob1 = document.getElementById('blu')
		var ob2 = document.createElement('DIV');
		var ob3 = document.createTextNode('fgdg');
		ob2.appendChild(ob3);
		ob1.appendChild(ob2);
		</script>
	</div>
</div>

là, ça ne marche pas. AhahAAAAAAAAAA. On approche de la logique DOM d'IE (il faut savoir que ça fonctionne sous linux et tous les navigateurs windows qui ont gecko).

Donc le script ne peut pas faire d'appendChild sur un élément qui n'est pas frère ou père tout au plus. Avec les enfants, y'a pas de problème.

J'ai pas vraiment l'impression que ça colle avec ce que tu dis, mais peut-être me trompe-je... En tout cas, je suis pas encore convaincu

. Alors je me permet d'insister !

**denisC** · 22/08/2005, 15h54

Envoyé par rekam

Certes, ma conclusion était hâtive, toutefois, je me permets de mettre en doute la tienne

Mais c'est qu'il insiste le bougre. C'est une erreur conceptuelle que de chercher de rajouter en DOM un élément alors que tout l'objet DOM n'est pas chargé. Ca n'a rien à voir avec IE ou Gecko ou ce que tu veux. Simplement, le principe de DOM c'est de charger tout l'arbre du document en mémoire et de faire des manipulations dessus. Et la ton arbre n'est pas encore complétement sur le poste client, il ne peut donc être chargé en mémoire, et jamais de la vie tu ne devrais être en train de travailler dessus....

Envoyé par rekam

Donc le script ne peut pas faire d'appendChild sur un élément qui n'est pas frère ou père tout au plus. Avec les enfants, y'a pas de problème.

Ce n'est pas du tout un problème d'accès au père ou au fils. De toute façon, un script n'a ni père ni fils ni rien du tout. Il est executé sur le document, et la seule chose influencé par sa place dans le code, est l'instant de son execution. Si ca ne marche pas, c'est simplement que le navigateur est en train de parser l'arbre HTML à un niveau plus bas, et il ne peux pas remonter dans son arbre en cours de construction.

Si IE accepte de le faire (ainsi que Gecko) c'est parcequ'ils sont bien gentils. Et aussi parcequ'ils sont au niveau actuel de parsage ou tu cherches à faire une insertion mais encore une fois, ce n'est pas du tout un problème de droits, simplement de logique de parsage du document. Je suppose que Gecko a l'intelligence de finir le parsage du document avant d'executer l'insertion DOM, puisque le developpeur n'a pas eu l'intelligence de le faire

**rekam** · 22/08/2005, 15h59

Oulà, attend, je crois que je commence à piger ce que tu avances...

En fait, pour paraphraser ce que tu dis, il plante à l'appendChild parce que le code est dans un enfant de <body> et que cet enfant n'est pas encore fermé. Donc il fait un appendChild dans un élément (le body) qui contient un enfant qui a une balise ouverte... Et il comprend plus rien et il plante.

Ouai, pas mal. T'as p'tet raison, finalement

Mais alors comment les autres navigateurs font pour gérer ce problème. Ou plutot, soyons philosophe, pourquoi gèrent-ils ce problème ? Mozilla, toujours à la pointe en ce qui concerne le w3c compliance, ne devrait-il pas dire "Attention, vous êtes entrain de faire n'importe quoi" ?

Bref, c'est pas encore très clair pour moi, mais quand meme un peu !

**rekam** · 22/08/2005, 16h01

En fait si, c'est parfaitement clair. Merci bien !

**denisC** · 22/08/2005, 16h08

Envoyé par denisC

Gecko a l'intelligence de finir le parsage du document avant d'executer l'insertion DOM

Quelque tests plus tard, en fait Gecko termine le parsage de l'élement en cours si sa profondeur est différente de l'élément inséré, alors que IE plante sur ce point.

Sinon, l'insertion a lieu (IE et Gecko) sur le document tel qu'actuellement en place, ce qui fait que ton body.appenChild n'est pas nécessairement à la fin de la page....

**rekam** · 22/08/2005, 16h59

Sous IE, il continue le parsage ? Parce que chez moi, il me met une alert "Internet Explorer n'a pas pu charger le document ......" puis il m'affiche un "page not found". C'est d'ailleurs pour ça que je m'inquiétais.

Mais j'ai trouvé des astuces pour que les scripts se lancent une fois le document loadé, sans passer par un onLoad dans le body (avec les addEventListener pour moz' et attachEvent pour ie).

a+!

**denisC** · 22/08/2005, 17h07

Envoyé par rekam

Mais j'ai trouvé des astuces pour que les scripts se lancent une fois le document loadé, sans passer par un onLoad dans le body (avec les addEventListener pour moz' et attachEvent pour ie).

Tu appelle ça une astuce? Moi j'appelle ça la norme (enfin les addEventListener de mozilla/W3C) et le onload du body une astuce.

Mais il t'aurais suffit de demander et je t'en aurais parlé 8)

[DOM] Bug en DOM sous IE

JavaScript

Discussions similaires

Partager

Partager