Comparer les id de deux div

**rakima** · 03/12/2019, 10h47

Bonjour tout le monde,

je fais un drag and drop de 6 div vers un autre et je veux comparer les id pour donner un sorte de score à la fin du classement que l'utilisateur fait, mais je sais pas vraiment comment m'y prendre,
le t me renvoie le div à l'interieur d un autre et j'aimerai acceder l'enfant parce que c'est lui qui contient les id pour les comparer
je mets une capture d'ecran
de l'aide svp!!
Merci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
var tabDeposables = document.querySelectorAll("#deposables>div");
var resultat = [6, 2, 4, 3, 1, 0, 5];
for (var j = 0; j < tabDeposables.length; j++) {
    var c = document.getElementById("alpha" + j).getAttribute("id") // les éléments glissés 
    var t = tabDeposables[j];
    if (t === c) { // le t me renvoie le div à l'interieur d un autre
        console.log("bravo");
    } else {
        console.log("ca marche pas");
    }
}

Pièce jointe 521494

**javatwister** · 03/12/2019, 10h54

Bonjour,

pourrais-tu régulariser ta PJ ou donner un peu plus de code, notamment HTML? J'ai l'impression que tabDeposables et c sont identiques;

**rakima** · 03/12/2019, 10h56

Voila mon code HTML

Code html :

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
<body>
	<section id="glissables">
		<div id="alpha0">Australie</div><!--5-->
		<div id="alpha1">Brésil</div> <!--4-->
		<div id="alpha2">Canada</div><!--1-->
		<div id="alpha3">Chine</div> <!--3-->
		<div id="alpha4">Etats-unis</div> <!--2-->
		<div id="alpha5">Inde</div> <!--6-->
		<div id="alpha6">Russie</div> <!--0-->
	</section>
	<p>Classer les pays ci-dessus par leur superficie, de la plus grande à la plus petite.</p>
	<p>Manipuler par "glisser/déposer" dans les cases ci-dessous.</p>
	<section id="deposables">
		<div></div>
		<div></div>
		<div></div>
		<div></div>
		<div></div>
		<div></div>
		<div></div> 
	</section>

**javatwister** · 03/12/2019, 11h36

avec qqch comme ça, tu te rapproches un peu plus de ce que tu veux faire:

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
for(var j = 0; j<tabDeposables.length ; j++){
						var t = tabDeposables[j];
						if(t.firstChild.id.substring(0,-1)==resultat[j]){
							console.log("bravo");	
						}
						else{
							console.log("perdu");
						}
 
					}

Mais veux-tu tester en direct chaque div déposé ou obtenir un bilan à la fin?

**SpaceFrog** · 03/12/2019, 11h43

En principe dans les bonnes pratiques un id ne dois pas être uniquement numérique ...
Tu pourrais passer par des data- pour cela ...

**javatwister** · 03/12/2019, 11h50

erratum: utilise slice(-1) à la place de substring(0,-1);

@SpaceFrog => ses id ne sont pas numériques, c'est juste le test de comparaison qui en donnait l'impression;

**javatwister** · 03/12/2019, 11h59

ce qui peut donner finalement

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
tabDeposables.forEach((v,i)=>{
	if(v.firstChild.id.slice(-1)===String(resultat[i])){
		console.log("bravo");	
	}
	else{
		console.log("perdu");
        }
})

Comparer les id de deux div

JavaScript

Vue hybride

Discussions similaires

Partager

Partager