Discussion :

[jeremux]

Bonjour,

Je viens d'apprendre le javascript en cours et je n'ai aucune base si ce n'est que le langage java lui même bref. Pour un td on doit compter le nombre de liens (a) contenu dans un éléments (li). Je n'ai vraiment pas d'idée sur le code. Pour compter le nombre de lien ok, mais sinon...

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
 
      function compter() {
	  	var a = document.getElementsByTagName('a');
		var cpt = 0;
		for (var i=0,c = a.length; i < c; i++){
				cpt = cpt + 1;
		}
		alert(cpt);
	  }
</script>

Comme spécifier que les liens doivent être contenus dans des "li" ?

Merci.

[Willpower]

Code js :

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

1
2
3
4
 var lis = document.getElementsByTagName('li'),cpt=0;
 for(var i=0;i<lis.length;i++)
 	cpt += lis[i].getElementsByTagName('a').length;
 alert(cpt);

[jeremux]

Merci Willpower, mais si le lien est fils d'un paragraphe et que ce paragraphe est fils d'un li alors il sera comptabilisé et ce n'est pas le résultat souhaité.

Par exemple pour ce code ça doit retourner 5:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<ul>
   <li> xxxx <a href=""> yyy</a> zzz </li>
   <li> xxxx <a href=""> yyy</a> zzz <a href=""> yyy</a></li>
   <li> xxxx </li>
</ul>
<ul>
   <li> xxxx <a href=""> yyy</a> zzz </li>
   <li> xxxx <a href=""> yyy</a> zzz <p><a href=""> yyy</a></p></li>
   <li> xxxx </li>
</ul>

[Willpower]

Merci Willpower, mais si le lien est fils d'un paragraphe et que ce paragraphe est fils d'un li alors il sera comptabilisé et ce n'est pas le résultat souhaité.

Par exemple pour ce code ça doit retourner 5:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<ul>
   <li> xxxx <a href=""> yyy</a> zzz </li>
   <li> xxxx <a href=""> yyy</a> zzz <a href=""> yyy</a></li>
   <li> xxxx </li>
</ul>
<ul>
   <li> xxxx <a href=""> yyy</a> zzz </li>
   <li> xxxx <a href=""> yyy</a> zzz <p><a href=""> yyy</a></p></li>
   <li> xxxx </li>
</ul>

et il pourra même être comptabilisé 2 fois dans le cas des li imbriqué ! au temps pour moi, ma réponse est totalement incorrecte !

[jeremux]

pas de soucis je pense que je n'ai pas assez détaillé le problème. J'ai essayé ça mais rien de concluant:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
 
      function compter() {
	  	var li = document.getElementsByTagName('li').childNodes;
		var cpt = 0;
		for (var i=0; i<li.length; i++){
				cpt = cpt + li[i].getElementsByTagName("a").length;
				}
		alert(cpt);
	  }
</script>

[Willpower]

Code js :

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

1
2
3
4
5
6
7
8
9
 
 	var li = document.getElementsByTagName('LI'),cpt=0;
	for(var i=0;i<li.length;i++) {
 		var child = li[i].childNodes;
 		for(var j=0;j<child.length;j++)
			if(child[j].nodeName == 'A')
				cpt++;
	}
 	alert(cpt);

[jeremux]

Merci WillPower ça marche Je vais essayer de comprendre où j'ai coincé dans mon code:

Code :

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

1
2
3
4
5
6
7
8
9
function compter() {
	  	var a = document.getElementsByTagName('a');
		var cpt = 0;
		for (var i=0; i<a.length; i++){
			if (a[i].parentNode==(document.getElementsByTagName('li'))[0]){
				cpt = cpt + 1;
				}
		}
		alert(cpt);}

(Si quelqu'un voit l'erreur n'hésitez pas, sinon je verrais demain avec la prof)


Merci à tous!

[Loceka]

Code js :

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

1
2
3
4
5
6
7
8
9
 
 	var li = document.getElementsByTagName('LI'),cpt=0;
	for(var i=0;i<li.length;i++) {
 		var child = li[i].childNodes;
 		for(var j=0;j<child.length;j++)
			if(child[j].nodeName == 'A')
				cpt++;
	}
 	alert(cpt);

En gros c'est exactement ce que j'ai dit au 2ième post...

C'est quoi le proverbe avec le poisson et la pêche déjà ?

ta solution ne comportant qu'une boucle est bien meilleure que la mienne.

la différence est que l'on part des A et que l'on recherche le parent ultime du type choisi, plutôt que de partir du parent ultime et de récupérer ses enfants A.

La différence ?
le nombre d'itération, je n'est pas testé car cela va dépendre du type de document que l'on a à scruter. C'est une alternative.

C'est en effet une solution alternative mais qui n'est pas "bien meilleure" à l'approche par les li.

D'accord y'a pas de boucle imbriquée mais statistiquement ça fera plus d'itération (or c'est le nombre d'itération qui fait la complexité) qu'une boucle imbriquée sur les li :

• Une page web standard contient généralement pas mal de liens
• Une page est généralement peu chargée en li (sémantiquement, ils dénotent une liste d'élément)
• Les élément li sont généralement des "feuilles" (il y'a rarement une arborescence importante qui en dépend)
• Il ne s'intéresse qu'au liens directement dépendant d'un li, ce qui évite de parcourir la sous-arborescence des li

Donc comme le dit NoSmoking, ça dépend du style de document : dans le cas d'une table des matière ce sera équivalent, dans le cas d'un listing il sera préférable de parcourir les "a", dans une page standard (avec un header, un menu, des rubriques, un footer) il sera préférable de parcourir les "li".

Bon, je dis ça sans avoir fait d'étude préalable mais je suis persuadé que si on choisi 10000 sites au hasard et qu'on fait le ratio a vs li sur chacune de leurs pages, ça devrait corroborer ce que je dis.

PS :
La page actuelle contient 440 <a et 113 <li>, chaque <li> contient un seul et unique fils, ce fils est soit un <a>, soit un <span>, soit un élément texte. Soit une complexité de 113 vs 440. ^_^

[Invité]

et avec l'objet links

Code :

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

1
2
 
monelement.links.length;