[DOM] masquer élément créé dans le script

Version imprimable

Bonjour,

dans une page je voudrai faire la chose suivante :

lorsque je clique sur un lien, je crée un nouveau div avec un texte quelconque dedans. Si plusieurs div ont été créé (en cliquant sur le lien prévu à cet effet), je veux que les div déjà créés ne soient pas affichés afin que l'on ne voit QUE le dernier div créé. Voici le code que j'utilise :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 var NbDiv = 0; function AjoutDiv(){ var NomNewDiv = prompt('Nom du calque à ajouter'); if (NomNewDiv != null){ NbDiv++; for(var i=0;i<NbDiv;i++){ var s = "T"+i; getElementById(s).style.display='none'; } var a = document.getElementById("DetailDiv"); a.innerHTML += "<div id=T"+NbDiv+">Détail 0 "+NomNewDiv+"</div>"; } }
or, apparemment, la ligne getElementById(s).style.display='none'; ne fonctionne pas...

Auriez vous une idée ? merci de votre aide !!!

30/09/2007, 08h41
javatwister

tu te préoccupes seulement de l'"affichage" des anciens div ou tu veux les supprimer de la page? (je penche pour la 2e vu que tu n'as aucune référence claire à ces div pour changer ultérieurement leur display...)
30/09/2007, 08h45
javatwister

à part ça, tu oublies "document. " au début de la ligne

Code:

getElementById(s).style.display='none';

et l'affectation du dernier div est très sale (moralement :mrgreen: );
renseigne-toi sur la méthode dom appendChild()
30/09/2007, 10h47
grinder59

Je ne veux que masquer les anciens div et pas les effacer...

Par contre, même avec document au début de la ligne

Code:

document.getElementById(s).style.display='none';

ça ne marche pas... :-(

et est-ce que c'et "moralement" acceptable d'utiliser les fonctions de node alors que mon document n'est pas du XML ?

Merci !

par exemple, fais ceci:

Code:

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
<script  type="text/javascript">
 
var NbDiv = 0, NomNewDiv, d;
 
function AjoutDiv(cadre){
 
	NomNewDiv = prompt('Nom du calque à ajouter');
 
	if (NomNewDiv != null){
 
		d=document.createElement("div");
		d.id="T"+NbDiv;
		d.appendChild(document.createTextNode("D&eacute;tail 0" + NomNewDiv)); 
 
		cadre.appendChild(d);				
 
		for(i=0; i != NbDiv; i++){
			document.getElementById("T"+i).style.display='none';
		}
 
		NbDiv++;	
	}
}
 
</script>
 
</head>
 
<body>
 
<div>
<a href="#" onclick="AjoutDiv(document.getElementById('DetailDiv'));return false">ajout</a>
</div>
 
<div id="DetailDiv"></div>

En fait, dans ton code, tu incrémentais NbDiv avant d'insérer un nouveau div;
du coup, tu demandais un display : none pour un élément qui n'existait pas encore, d'où l'erreur de script, spécifiée dans tous les navigateurs;

30/09/2007, 11h57
grinder59

ça marche très bien...

je ne t'en demandais pas tant, mais ça me rend bien service...

un grand MERCI !!!!