ID de Positionnement d'un noeud

**DanielCosta** · 17/03/2008, 09h05

Bonjour, j'ai tenté de trouver la position d'un noeud dans son parent en Javascript, telle que le ferais l'expression Position() en XPath.

Je m'explique un peut mieux. Avec un 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
 
<div id="parent">
  <div onclick="getPosition(this)">Div 1</div>
  <div onclick="getPosition(this)">Div 2</div>
  <div onclick="getPosition(this)">Div 3</div>
  <div onclick="getPosition(this)">Div 4</div>
  <div onclick="getPosition(this)">Div 5</div>
</div>
 
<script type="JavaScript">
  function getPosition(elem)
  {
    return elem.ProprieteQuiDonneLaPosition;
  }
</script>

Voilà quand je clique sur Div 1 il doit me renvoyer 0, quand je clique sur Div 5 il doit me renvoyer 4. Ce qui me manque c'est la propriété "ProprieteQuiDonneLaPosition" donc si vous en connaissez une toute prête je suis preneur sinon je créer une fonction pour avec nextsibling et previoussibling.

Merci de vos futures réponses.
DanielCosta

**SpaceFrog** · 17/03/2008, 09h32

offsetLeft et offsetHeight... il y a un script lç dessus dans la FAQ ...

**le_chomeur** · 17/03/2008, 09h36

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<script type="text/javascript">
function ThisPosition(Me){
	var MyParent = Me.parentNode ;
	var ListElement = MyParent.childNodes;
	var nbElements = ListElement.length;
	var MyPosition = "";
	var noeudVide = 0;
	for(var i = 0 ; i < nbElements; i++){
		if(ListElement[i].nodeType == 3)
		{
			noeudVide++;
		}
		if(ListElement[i] == Me)
		{
			break;
		}
	}
	return i-noeudVide;
}
	</script>
<body>
<ul>
<li onclick="alert(ThisPosition(this));">0</li>
<li onclick="alert(ThisPosition(this));">1</li>
<li onclick="alert(ThisPosition(this));">2</li>
<li onclick="alert(ThisPosition(this));">3</li>
<li onclick="alert(ThisPosition(this));">4</li>
<li onclick="alert(ThisPosition(this));">5</li>
<li onclick="alert(ThisPosition(this));">6</li>
</ul>
</body>
</html>

Avec la gestion des noeud vide sous les moteur gecko

lol spaffy , je crois que tu n'as pas bien lut

**SpaceFrog** · 17/03/2008, 09h50

Arf oui désolé position hierarchique et pas coordonnées

**DanielCosta** · 17/03/2008, 11h36

Re: Merci à vous deux. J'ai choisi la solution proposée par childNodes même si j'ai hésiter de me servir d'une autre solution.

Pour ceux que ça intéresse l'autre soluce c'est de passer tout les childs d'un nœud dans un tableau et de retrouver la position avec indexOf()

ID de Positionnement d'un noeud

JavaScript

Vue hybride

Discussions similaires

Partager

Partager