11548 sujets

JavaScript, DOM et API Web HTML5

Bonsoir,
j'essai d'effacer les éléments enfants d'un bloc en utilisant une boucle mais ça ne fonctionne pas...


function killbulle(){
var blocsortie = document.getElementById("infobulle");
var noeud_tab = blocsortie.childNodes.length;
for(i=0; i<noeud_tab; i++){
	blocsortie.removeChild(blocsortie.childNodes[ i]);
	}
blocsortie.style.visibility="hidden";
}


Mais fait comme ça, ça fonctionne:

function killbulle(){
var blocsortie = document.getElementById("infobulle");
/*var noeud_tab = blocsortie.childNodes.length;
for(i=0; i<noeud_tab; i++){
	blocsortie.removeChild(blocsortie.childNodes[i ]);
	}*/
var noeud1 = blocsortie.childNodes[0];
var noeud2 = blocsortie.childNodes[1];
var noeud3 = blocsortie.childNodes[2];
blocsortie.removeChild(noeud1);
blocsortie.removeChild(noeud2);
blocsortie.removeChild(noeud3);
blocsortie.style.visibility="hidden";
}


...Pas très pratique pour s'en reservir Smiley ohwell . Je n'arrive vraiment pas à saisir la subtilité...
Modifié par ilhooq (26 Jan 2006 - 22:19)
En Cherchant bien j'ai pu résoudre seul mon problème:
apparemment il fallait concevoir la boucle de manière décroissante pour pouvoir accéder en premier au dernier noeud pour ensuite remonter vers le premier. La destruction doit se faire de manière hiérarchique.

Avec cette fonction on peut donc supprimer tous les éléments enfants d'un noeud:


function killChildNodes(){
noeud = document.getElementById("mon_noeud")[lol]
var noeud_tab = noeud.childNodes.length;
for(i=noeud_tab-1; i>=0; i--){
noeud.removeChild(noeud.childNodes[i]);
}
}
[/i]
Bonsoir,
Je pense que c'est dû au décalage que provoque removeChild dans le tableau childNodes.

Voici une explication pas à pas de ce que j'avance :
Admettons qu'au départ, nous avons 7 éléments dans le tabelau childNodes : A, B, C, D, E, F, G.

Ta boucle for commence à parcourir au début de ce tableau, index 0. Donc de là, on parachute le premier élément, le A.
On a donc : B, C, D, E, F, G

Ensuite, tu incrémentes ton compteur i, donc le prochaîn élément supprimé sera celui qui a alors l'index 1, c'est-à-dire non pas le B, mais le C.
On arrive donc à : B, D, E, F, G

Ensuite, on va supprimer l'élément ayant l'index 2 dans le teableau, en l'occurence E. Ce qui donne : B, D, F, G

Au final, G sera encore supprimé. Ensuite, comme i a atteint la taille du tableau à ce moment-là, on sort de la boucle. IL te reste donc un élément sur deux.
Oui, en effet, je n'avais pas pensé que le tableau childNodes "se reconstituait" à chaque passage de la boucle. C'est pourquoi, il faut décrémenter i à chaque passage pour pouvoir supprimer progressivement chaque noeud enfant en commençant par le dernier jusqu'au premier pour éviter ce décalage. On supprime en somme des clés d'indexation du tableau correspondant à des éléments enfant et pas la valeur pointée par lesdites clés, nuance. Smiley smile