[DOM] Modification innerHTML impossible

**Christophe Charron** · 26/05/2007, 19h26

Bonsoir,
sous Internet Explorer 7 (je n'ai pas testé les autres) je n'arrive pas à modifier l'innerHTML d'une balise DIV sauf si cette balise div est elle même dans une balise div !!!
Cela me permet de contourner ce problème mais j'aimerais quand même comprendre pourquoi !!!
Je n'ai bien évidemment pas de problème avec Firefox 2.0.0.3 qui est a priori plus respectueux des standards W3C

Ici la page qui réagit correctement et sous Internet Explorer et sous Firefox et là, la page qui ne fonctionne que sous Firefox et qui est à mon avis syntaxiquement correcte et normale.
Merci de m'éclairer sur cette bizarrerie

**SpaceFrog** · 26/05/2007, 20h35

A mon avis cela veint plutot de la reference à l'objet ???
tu l'appelles comment ton div ? par son id ?

**Christophe Charron** · 26/05/2007, 21h32

Oui par son id.

voila tout le code de la page précitée visible ici : http://test03.christophe-charron.org.../Nouveau2.html

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>La tache fait-elle tache?</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="style.css" />
</head>
<body onload="ejs_aff_photos(0);">
<div id="plan" class="image"</div>
<br><CENTER><IMG id="laphoto" src='' BORDER=0></CENTER><br>
<img style="width: 1000px; height: 218px;" alt="" src="first.jpg">
<script type="text/javascript">
ejs_photo = new Array;
ejs_photo[0] = 'images/01.jpg';
ejs_photo[1] = 'images/02.jpg';
ejs_photo[2] = 'images/03.jpg';
</script>
<script type="text/javascript">
function ejs_aff_photos(num)
	{
    ejs_fin = "";
		if(num!=0) {
			ejs_fin += " | <A HREF=# onClick='ejs_aff_photos("+(num-1)+");return(false)'><span class=imgprec> Image pr&eacute;c&eacute;dente</span></A>";
		}
		if(num!=(ejs_photo.length-1)) {
			ejs_fin += " | <A HREF=# onClick='ejs_aff_photos("+(num+1)+");return(false)'><span class=imgsuiv>Image suivante </span></A>";
		}
    document.getElementById("plan").innerHTML = '<span class="accueil"><a href="../../index.html">Menu</a></span> | <a href="../graphisme.php"><span class=retour> Retour</span></a> | <a href="../depouille/depouille.php"><span class=rubprec> Rubrique pr&eacute;c&eacute;dente</span></a> | <a href="../contact/contact.php"><span class=contact> Contact</span></a>'+ejs_fin;
    try {
      document.getElementById("laphoto").setAttribute("src",ejs_photo[num]);
    } catch (e) {
		  //alert(e);
	 }
	}
</script>
</body>
</html>

**SpaceFrog** · 27/05/2007, 08h42

et le script au milieu du div c'est normal ?
il se sentirait bien mieux dans le head ...

**Christophe Charron** · 27/05/2007, 10h34

Admettons. Je pensais qu'une balise script était une balise comme une autre.
J'ai donc créé une page avec le script dans le head, mais cela ne change pas.
La nouvelle page : http://test03.christophe-charron.org.../Nouveau4.html
Et comment expliquer que la "bonne" page avec plein de "div" en trop fonctionne avec le script en plein milieu : http://test03.christophe-charron.org.../Nouveau2.html ?

**SpaceFrog** · 27/05/2007, 10h50

je ne vois pas ou ça coince ?
Faut dire je connais pas IE ...

Et de toute façon créer des balsies avec innerHTML c'est chercher les ennuis ...

La solution c'est DOM createElement

**Christophe Charron** · 27/05/2007, 13h37

Envoyé par SpaceFrog

je ne vois pas ou ça coince ?

Vous voulez dire que depuis votre navigateur, le script s'exécute bien dans tous les cas et que donc vous visualisez les images ??

Envoyé par SpaceFrog

Faut dire je connais pas IE ...

Heu ... moi non plus et je n'y tiens pas particulierement mais il y a encore une majorité d'utilisateurs de IE

Envoyé par SpaceFrog

Et de toute façon créer des balsies avec innerHTML c'est chercher les ennuis ...

Pourquoi ?

Envoyé par SpaceFrog

La solution c'est DOM createElement

Je suis bien d'accord.
Le code n'est pas de moi et je ne voulais pas m'embêter puisque j'avais une solution de contournement. C'est simplement pour comprendre pourquoi rajouter des balises DIV résolvaient le problème/bug ...

[DOM] Modification innerHTML impossible

JavaScript

Discussions similaires

Partager

Partager