Accès à un élément ajouté dynamiquement.

21 sept. 2007, 07:45

Bonjour,

J'ai réalisé un diaporama dont le fonctionnement me convient, mais j'aimerais simplifier la page appelante.
La page qui permet de l'appeler se présente comme suit :

Code : Tout sélectionner

<html>
<head>
<script language="javascript" src="diaporama.js" type="text/javascript"></script>
<script language="javascript" src="config_diaporama.js" type="text/javascript"></script>
</head>
<body onload="InitDiaporama()">

Ceci est une page de test pour mettre au point le diaporama javascript.
<div id='diaporama'>
		<div id='dimage1' style='position: absolute;'>
			<img src='' style='position: absolute; border: 0 none; width: 0; height: 0;' id='image1' alt='' />
		</div>
		<div id='dimage2' style='position: absolute;'>
			<a href="" id="lien">
				<img src='' style='position: absolute; border: 0 none; width: 0; height: 0;' id='image2' alt='' />
			</a>
		</div>
</div>
Ceci est le bas de page...
<div id='debug_diaporama'>
</div>
</body>
</html>

Pour simplifier, j'aimerais que ce soit le code javascript qui écrive une partie des div afin de n'avoir par exemple que :

Code : Tout sélectionner

<html>
<head>
<script language="javascript" src="diaporama.js" type="text/javascript"></script>
<script language="javascript" src="config_diaporama.js" type="text/javascript"></script>
</head>
<body onload="InitDiaporama()">

Ceci est une page de test pour mettre au point le diaporama javascript.
<div id='diaporama'>
</div>
Ceci est le bas de page...
<div id='debug_diaporama'>
</div>
</body>
</html>

et que ce soit le code javascript qui rajoute :

Code : Tout sélectionner

		<div id='dimage1' style='position: absolute;'>
			<img src='' style='position: absolute; border: 0 none; width: 0; height: 0;' id='image1' alt='' />
		</div>
		<div id='dimage2' style='position: absolute;'>
			<a href="" id="lien">
				<img src='' style='position: absolute; border: 0 none; width: 0; height: 0;' id='image2' alt='' />
			</a>
		</div>

dans le div diaporama.
J'ai essayé par :

Code : Tout sélectionner

document.getElementById('diaporama').InnerHTML="<div id='dimage1' style='position: absolute;'>\n"
document.getElementById('diaporama').InnerHTML+=" </div>\n"

ou bien

Code : Tout sélectionner

longueurCible = document.getElementById('diaporama').firstChild.length;
document.getElementById('diaporama').firstChild.replaceData(0, longueurCible, "<div id='dimage1' style='position: absolute;'>\n</div>");

dans les deux cas, je n'arrive pas à atteindre mon élément 'dimage1' par document.getElementById('dimage1').

Pour résumer : quand je change le contenu d'un div pour ajouter un nouvel élément au document, je n'arrive pas à accéder à ce nouvel élément.

Je commence à douter que c'est possible, avez-vous une idée ?

D'avance merci pour vos réponses.

Accès à un élément ajouté dynamiquement.

Qui est en ligne