Suppression d'objet en JS marche � moiti�..

**dragonfly** · 28/12/2010, 10h14

Bonjour � tous.

Je viens vers vous car il y'a quelque chose qui m'�chappe dans JS, je m'explique.

J'ai cr�� une fonction qui, en fonction d'une racine d'ID, supprime tous les �l�ments ayant cette racine dans leur ID. Le probl�me c'est que la suppression ne se fait que sur 1 objet sur 2.

Voici mon code :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
 
 var listeDivEnf = document.body.getElementsByTagName(typeS);
	    $j(document).ready(function(){
		for(i = 0; i<listeDivEnf.length ; i++){
			if(listeDivEnf[i].id.match(idS)){
				if (action=="efface"){
			listeDivEnf[i].parentNode.removeChild(listeDivEnf[i]);
				}
			}
 
		}
	     })

En fait dans le if du match, quand je fais un "alert" avec l'ID, je remarque que seulement 1 ID sur 2 est affich� alors que quand je fais l'alert avant ce if, TOUS les ID s'affichent...

Si quelqu'un a une id�e

**SpaceFrog** · 28/12/2010, 10h34

y'avait longtemps quel l'on avait pas eu le une fois sur deux avec un match !!

on peut voir ou tu d�clares idS ?

l'id�al est de mettre la regexp directement dans le match

le souci provient du fait que le matche provoque un d�placement du pointeur de la regExp

un pansement est de reinitialiser le pointeur de la reg en matchant � vide...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
var listeDivEnf = document.body.getElementsByTagName(typeS);
	    $j(document).ready(function(){
		for(i = 0; i<listeDivEnf.length ; i++){
			if(listeDivEnf[i].id.match(idS)){
				if (action=="efface"){
			listeDivEnf[i].parentNode.removeChild(listeDivEnf[i]);
				}
			}
		rien=''
               rien.match(idS)
		}
	     })

**franculo_caoulene** · 28/12/2010, 10h34

Salut,

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

 $j(document).ready(function(){...

Utilises-tu un framework? Si oui, pourquoi ne pas l'utiliser pleinement en faisant appel directement aux s�lecteurs CSS. Tu n'aurais m�me plus � boucler, si c'est jQuery.

**dragonfly** · 28/12/2010, 10h49

Merci pour vos r�ponses

idS est declar� ainsi

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
 
	var listeObj = new Array('divImage1Vers','divImage2Vers','divImage3Vers','divImage4Vers');
	for(i=0;i<listeObj.length;i++){
		obj.actionGroupe("table",listeObj[i],"efface");
	}

Avec un appel dans la fonction

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
this.actionGroupe = function(typeS, idS, action){
 var listeDivEnf = document.body.getElementsByTagName(typeS);
	    $j(document).ready(function(){
		for(i = 0; i<listeDivEnf.length ; i++){
			if(listeDivEnf[i].id.match(idS)){
				if (action=="efface"){
			listeDivEnf[i].parentNode.removeChild(listeDivEnf[i]);
				}
			}
 
		}
	     })
}

Je ne comprends pas le d�placement du curseur du pointeur, c'est quoi ce probl�me?
En fait j'utilise souvent cette fonction (avec d'autres actions, d'ou l'appel � du JQuery), sans avoir ce probl�me.

De plus avec mon code plus haut en fait il y'a :

divImage1Vers1 qui est supprim�
divImage1Vers2 qui est ignor�
divImage1Vers3 qui est supprim�
etc...

Je vais voir essayer le r�init du match cet apr�m.

P.S : Je n'utilise pas jQuery car je d�bute en JQuery et pour l'instant je ne l'utilise que pour les trucs qui sont pas faisables en JS "standard".
Apr�s si y' un truc en Jquery, je prends

**SpaceFrog** · 28/12/2010, 10h56

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
var listeObj = new Array('divImage1Vers','divImage2Vers','divImage3Vers','divImage4Vers');
	for(i=0;i<listeObj.length;i++){
		obj.actionGroupe("table",new RegExp('^'+listeObj[i]),"efface");
	}

+ le code pr�c�dent avec le reste par match sur rien

pour l'explication du pointeur
http://www.developpez.net/forums/d82...script/regexp/

**Bovino** · 28/12/2010, 11h06

Spaffy, il y a aussi l'erreur classique de supprimer un �l�ment de tableau alors qu'on est en train de boucler dessus

En gros, si le tableau � 5 �l�ments, si tu effaces l'entr�e 2, l'occurrence suivante (3) correspondra en fait � l'indice 4 du tableau d'origine

EDIT :

je ne l'utilise que pour les trucs qui sont pas faisables en JS "standard".

Lesquels ???

**SpaceFrog** · 28/12/2010, 11h13

arf yesss Beef

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
while (elt[0])

ou commencer par la fin et d�cr�menter

**dragonfly** · 28/12/2010, 11h39

Merci pour vos r�ponses rapides,

j'essaye cela ce midi en rentrant chez moi.
C'est vrai que le parcours d'�l�ment, je ne voyais pas cela comme un tableau, mais effectivement si il supprime l'�l�ment du tableau y'a d�callage et l'�lement d'apr�s est pass�.

Mais histoire de bien comprendre ce qui se passe en fait :

le "while(elt[0])" sert � justement prendre r��llement tous les �lements, donc il faut que je le mette � la place du

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

for(i = 0; i<listeDivEnf.length ; i++){...

Mais du coup le match doit se faire avant de parcourir la liste des solutions possibles (sinon le while ne s'arr�te jamais car j'ai des elements qui ne rentrent pas dans le match).

Ou sinon je peut incr�menter un compteur et supprimer l'element comme suis

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
listeDivEnf[i-cpt].parentNode.removeChild(listeDivEnf[i-cpt]);

ce qui est moins "conventionnel" mais qui est plus rapide

Envoy� par Bovino

EDIT :

Lesquels ???

Des trucs du genre :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
if ($j(listeDivEnf[i]).css("display")=="none"){...

Faisable en standard surement mais bcp plus simple via jQuery.

Je test tout �a et je reviens vers vous.
Mille mercis pour vos �claircissement

(je suis un peu confus aussi car j'ai l'impression que ce probl�me arrive assez souvent)

**Bovino** · 28/12/2010, 11h48

Attention, le while(elt[0]) servira pour supprimer tous les �l�ments list�s. Pour n'en supprimer qu'une partie, il faut passer par une boucle invers�e :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

for(i = listeDivEnf.length - 1; i>=0 ; i--)

Sinon

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

if ($j(listeDivEnf[i]).css("display")=="none")

s'�crit facilement sans jQuery :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

if (listeDivEnf[i].style.display=="none")

**franculo_caoulene** · 28/12/2010, 11h54

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

$j('div[id^="racine"]').empty();

Je ne sais pas sur quel genre de projet tu travailles. Soit, jQuery est utilis� ailleurs, � ce moment l� "tu dois" l'utiliser. Soit il n'est utilis� nulle part ailleurs, � ce moment l� supprimes

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

 $j(document).ready(function(){...

**dragonfly** · 28/12/2010, 12h08

Envoy� par Bovino

Sinon

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

if ($j(listeDivEnf[i]).css("display")=="none")

s'�crit facilement sans jQuery :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

if (listeDivEnf[i].style.display=="none")

En fait ce n'est pas exactement la m�me chose car le
if (listeDivEnf[i].style.display=="none")
ne ram�ne rien si il n'est d�fini QUE dans le CSS mais la version JQuery ram�ne bien quelque chose. (avant de prendre la version JQuery, j'utilisais ta m�thode qui ne fonctionnait pas la "premi�re" fois que l'objet passait dans le test).

Franculo_caoulene, le jQuery est bien utilis� autre part (mais pas de rapport avec mon probl�me donc je l'ai pas mis...(en fait si CF plus haut)).

Je dois pas �tre bien OP ce matin, Bovino effectivemment la boucle invers� r�gle cette partie du probl�me assez facilement (je sais pas pourquoi dans ma t�te je voyais l'usine � gaz => � tort).

Je test et je reviens vers vous en d�but d'apr�m.

Bon ap'

**dragonfly** · 28/12/2010, 14h03

Re bonjour,

avec simplement

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

for(i = listeDivEnf.length - 1; i>=0 ; i--)

le probl�me a totalement disparu.
Je n'ai pas eu besoin de modifier le regexp.

Merci beaucoup pour vos r�ponses rapides et � combien utile

Bonnes f�tes

**dukej** · 28/12/2010, 15h09

Envoy� par dragonfly

Merci pour vos r�ponses rapides,

j'essaye cela ce midi en rentrant chez moi.
C'est vrai que le parcours d'�l�ment, je ne voyais pas cela comme un tableau, mais effectivement si il supprime l'�l�ment du tableau y'a d�callage et l'�lement d'apr�s est pass�.

Mais histoire de bien comprendre ce qui se passe en fait :

le "while(elt[0])" sert � justement prendre r��llement tous les �lements, donc il faut que je le mette � la place du

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

for(i = 0; i<listeDivEnf.length ; i++){...

Mais du coup le match doit se faire avant de parcourir la liste des solutions possibles (sinon le while ne s'arr�te jamais car j'ai des elements qui ne rentrent pas dans le match).

Ou sinon je peut incr�menter un compteur et supprimer l'element comme suis

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
listeDivEnf[i-cpt].parentNode.removeChild(listeDivEnf[i-cpt]);

ce qui est moins "conventionnel" mais qui est plus rapide

Des trucs du genre :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
if ($j(listeDivEnf[i]).css("display")=="none"){...

Faisable en standard surement mais bcp plus simple via jQuery.

Je test tout �a et je reviens vers vous.
Mille mercis pour vos �claircissement

(je suis un peu confus aussi car j'ai l'impression que ce probl�me arrive assez souvent)

En fait pour mieux comprendre la chose et �a �claircira tous les esprits :
quand tu fais un

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

var div = machin.getElementsByTagName('div');

tu r�cup�res div, mais div n'est pas un tableau mais une "nodelist", et une nodelist est dynamique, ce qui signifie que si tu supprimes un div � l'int�rieur de "machin", alors la nodelist "div" voit son nombre diminuer. Et du coup l'index de tes divs est d�caler aussi.

J'esp�re avoir �t� assez clair. Si plus d'infos demandez moi

**danielhagnoul** · 28/12/2010, 21h59

Bonsoir

Envoy� par franculo_caoulene

Salut,

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

 $j(document).ready(function(){...

Utilises-tu un framework? Si oui, pourquoi ne pas l'utiliser pleinement [...]

O� : Pourquoi faire simple lorsque l'on peut faire tr�s compliqu� !

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
// sauf erreur de ma part, le code qui suit se résume à un simple :
$("div[id^='divImage']").remove();
 
/*
var listeObj = new Array('divImage1Vers','divImage2Vers','divImage3Vers','divImage4Vers');
 
for(i=0;i<listeObj.length;i++){
	obj.actionGroupe("table",listeObj[i],"efface");
}
 
this.actionGroupe = function(typeS, idS, action){
	var listeDivEnf = document.body.getElementsByTagName(typeS);
 
	$j(document).ready(function(){
		for(i = 0; i<listeDivEnf.length ; i++){
			if(listeDivEnf[i].id.match(idS)){
				if (action=="efface"){
					listeDivEnf[i].parentNode.removeChild(listeDivEnf[i]);
				}
			}
		}
	});
}
*/

Exemple :

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!doctype html>
<html lang="fr">
<head>
	<meta http-equiv="X-UA-Compatible" content="chrome=1">
	<meta charset="utf-8">
	<meta name="Author" content="Daniel Hagnoul">
	<title>Forum jQuery</title>
	<style>
		/* Base */
		body { background-color:#dcdcdc; color:#000000; font-family:sans-serif; font-size:medium; font-style:normal;
		font-weight:normal; line-height:normal; letter-spacing:normal; }
		h1,h2,h3,h4,h5 { font-family:serif; }
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img { margin:0px; padding:0px; }
		h1 { font-size:2em; text-shadow: 4px 4px 4px #bbbbbb; text-align:center; }
		p { padding:6px; }
		div#conteneur { width:95%; min-width:800px; min-height:500px; margin:12px auto; background-color:#FFFFFF;
		color:#000000; border:1px solid #666666; }
 
		/* Test */
	</style>
</head>
<body>
	<h1>Forum jQuery</h1>
	<div id="conteneur">
		<div id="divImage1Vers">
			<p>Un mot pour remplir</p>
		</div>
		<div id="divImage2Vers">
			<p>Un mot pour remplir</p>
		</div>
		<div id="divImage3Vers">
			<p>Un mot pour remplir</p>
		</div>
		<div id="divImage4Vers">
			<p>Un mot pour remplir</p>
		</div>
	</div> 
	<script charset="utf-8" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
	<script>
		$(function(){
 
// le code qui suit se résume à un simple :
$("div[id^='divImage']").remove();
 
/*
var listeObj = new Array('divImage1Vers','divImage2Vers','divImage3Vers','divImage4Vers');
 
for(i=0;i<listeObj.length;i++){
	obj.actionGroupe("table",listeObj[i],"efface");
}
 
this.actionGroupe = function(typeS, idS, action){
	var listeDivEnf = document.body.getElementsByTagName(typeS);
 
	$j(document).ready(function(){
		for(i = 0; i<listeDivEnf.length ; i++){
			if(listeDivEnf[i].id.match(idS)){
				if (action=="efface"){
					listeDivEnf[i].parentNode.removeChild(listeDivEnf[i]);
				}
			}
		}
	});
}
*/
		});
 	</script>
</body>  
</html>

**dragonfly** · 31/12/2010, 15h15

A tester, mais c'est vrai que c'est plus simple...

Merci

**SpaceFrog** · 31/12/2010, 17h09

tester ? pourquoi faire ...

Suppression d'objet en JS marche � moiti�..

JavaScript

Discussions similaires

Partager

Partager