Numeroter une balise

Version imprimable

Bonjour
J'aimerais bien que vous pm'aider.
J'ai un document et je voudrais écrire une fonction en javascript qui parcourt ce document à la recherhce de tous les éléments H1.
Pour chaque éléments H2 trouvés, il affiche dans une listre trié le nom du paragraphe.j'ai essayé avec de céer la fonction liste
Code:

1 2 3 4 5 6 7 8 function liste() { var ol=document.createElement("ol"); var listeh2=document.getElementsByTagName("h2"); for (var i=0;i<listeh2.length;i++) (je suis perdu à ce niveau, j'arrive pas à faire la liste qui affiche le résultata) }
A partir de la je je sais plus quoi faire.

17/12/2006, 18h37
landryx

salut

quest-ce que tu entends par nom du paragraphe?serait-ce le contenu du h2?
17/12/2006, 18h47
foxrol
Citation:

Envoyé par landryx

salut

quest-ce que tu entends par nom du paragraphe?serait-ce le contenu du h2?

.
Par exemple si nous avons dans le document
Code:

1 2 3 4 5 <h2>Toto est la</h2> <h2>Toto est parti</h2> <h2>Titi est la</h2>
Alors le résultat sera de la forme
Code:

1 2 3 4 1.Toto est la 2-Toto est parti. 3.Titi est la

Un essaie, codé à la volé (donc non-testé):
Code:

1 2 3 4 5 6 7 8 9 10 function RechercherTag(type){ var resultat = ""; void(el=document.getElementsByTagName(type)); for(i=0;i<el.length;i++) resultat += (i+1) + "." + el.innerHTML + "<br />"; return resultat; } document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
^^ tiend moi au courrant si jamais ca fonctionne (sinon bah j'ai plus ou moins envie de le débugger à vrai dire...)

Citation:
Envoyé par FMaz
Un essaie, codé à la volé (donc non-testé):
Code:

1 2 3 4 5 6 7 8 9 10 function RechercherTag(type){ var resultat = ""; void(el=document.getElementsByTagName(type)); for(i=0;i<el.length;i++) resultat += (i+1) + "." + el.innerHTML + "<br />"; return resultat; } document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
^^ tiend moi au courrant si jamais ca fonctionne (sinon bah j'ai plus ou moins envie de le débugger à vrai dire...)
Bonsoir
non ce ne marche pas, il ne m'affiche pas les titre des éléments H2.
d'autres part comment faire pour lister les résultats sous formes de liste ordonnées numérotées?

Code:

1
2
3
4
5
6
7
8
9
10
 
function RechercherTag(type){
	var resultat = "";
	var el=document.getElementsByTagName(type);
	for(i=0;i<el.length;i++) {
		resultat += (i+1) + ". " + el[i].innerHTML + "<br />";
	}
	return resultat;
}
document.getElementById('div_resultat').innerHTML = RechercherTag("H2");

Et comme ca ?

Citation:
Envoyé par FremyCompany
Code:

1 2 3 4 5 6 7 8 9 10 function RechercherTag(type){ var resultat = ""; var el=document.getElementsByTagName(type); for(i=0;i<el.length;i++) { resultat += (i+1) + ". " + el[i].innerHTML + "<br />"; } return resultat; } document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
Et comme ca ?
Bonjour
non, il me met

Code:

document.getElementById('div_resultat').innerHTML = RechercherTag("H2");

à la valeur Nulle ou n'est pas un objet

18/12/2006, 10h04
FremyCompany

Est ce qu'il existe dans ton HTML (et avant ce script) une balise qui a 'div_resultat' pour ID ???

sinon ajoute ceci avant le script :

Code:

<div id='div_resultat'></div>

Citation:

Envoyé par FremyCompany

Est ce qu'il existe dans ton HTML (et avant ce script) une balise qui a 'div_resultat' pour ID ???

sinon ajoute ceci avant le script :

Code:

<div id='div_resultat'></div>

Oui.
Je te fais une copie de mon html

Code:

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
 
 
<!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" />
    <meta name="author" content="tentacukle" />
    <meta name="date" content="13/11/2005" />
    <meta name="sequence" content="sequence" />
    <title>Le titre</title>
	<script>
	function RechercherTag(type){
	var resultat = "";
	var el=document.getElementsByTagName(type);
	for(i=0;i<el.length;i++) {
		resultat += (i+1) + ". " + el[i].innerHTML + "<br />";
	}
	return resultat;
	}
	document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
	</script>
<meta name="generator" content="namo webeditor(trial)" />
</head>
<div id="div_resultat">
<script language="javascript" type="text/javascript">
 alert(RechercherTag("H2"));
 </script>
</div>
 <h1>Titre principal</h1>
 <h2>Premier paragraphe</h2>
 <p>bla, bla, bla...</p>
 <h2>Deuxième paragraphe</h2>
 <p>bla, bla, bla...</p>
</body>
</html>

Non, au momment ou le script s'exécute, le div n'existe pas encore...

Il faut mettre ce scritp JUSTE AVANT la balise de fermeture </body>

Correction :

Code:

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
 
<!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" />
    <meta name="author" content="tentacukle" />
    <meta name="date" content="13/11/2005" />
    <meta name="sequence" content="sequence" />
    <title>Le titre</title>
<meta name="generator" content="namo webeditor(trial)" />
</head>
<div id="div_resultat">
</div>
 <h1>Titre principal</h1>
 <h2>Premier paragraphe</h2>
 <p>bla, bla, bla...</p>
 <h2>Deuxième paragraphe</h2>
 <p>bla, bla, bla...</p>
<!--
    Ne rien mettre en dessous de ce commentaire, si ce n'est le script
-->
	<script><!--
        function RechercherTag(type){
        var resultat = "";
        var el=document.getElementsByTagName(type);
        for(i=0;i<el.length;i++) {
                resultat += (i+1) + ". " + el[i].innerHTML + "<br" + " />"; //<!--
        }
        return resultat;
        }
        document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
        --></script>
</body>
</html>

Citation:

Envoyé par FremyCompany

Non, au momment ou le script s'exécute, le div n'existe pas encore...

Il faut mettre ce scritp JUSTE AVANT la balise de fermeture </body>

Correction :

Code:

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
 
<!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" />
    <meta name="author" content="tentacukle" />
    <meta name="date" content="13/11/2005" />
    <meta name="sequence" content="sequence" />
    <title>Le titre</title>
<meta name="generator" content="namo webeditor(trial)" />
</head>
<div id="div_resultat">
</div>
 <h1>Titre principal</h1>
 <h2>Premier paragraphe</h2>
 <p>bla, bla, bla...</p>
 <h2>Deuxième paragraphe</h2>
 <p>bla, bla, bla...</p>
<!--
    Ne rien mettre en dessous de ce commentaire, si ce n'est le script
-->
	<script><!--
        function RechercherTag(type){
        var resultat = "";
        var el=document.getElementsByTagName(type);
        for(i=0;i<el.length;i++) {
                resultat += (i+1) + ". " + el[i].innerHTML + "<br" + " />";
        }
        return resultat;
        }
        document.getElementById('div_resultat').innerHTML = RechercherTag("H2");
        --></script>
</body>
</html>

Dis je débute en javascript et je pensais qu'il fallait toujours mettre le script dans l'entête.

18/12/2006, 10h20
FremyCompany

Citation:

Envoyé par foxrol

Dis je débute en javascript et je pensais qu'il fallait toujours mettre le script dans l'entête.

Non, c'est une fausse idée.
Tu peux mettre ton code ou tu veux
18/12/2006, 10h22
foxrol

Re

Citation:

Envoyé par FremyCompany

Non, c'est une fausse idée.
Tu peux mettre ton code ou tu veux

Ok.
mais pkoi dans ce cas précis, si je le mets dans le head il ne fonctionne plus?
18/12/2006, 10h24
FremyCompany

Citation:

Envoyé par foxrol

Ok.
mais pkoi dans ce cas précis, si je le mets dans le head il ne fonctionne plus?

Par ce que au momment ou ton script est exécuté, tout ce qui ce trouve en dessous n'existe pas encore !
donc il n'y a pas de balise body, pas de div "div_resultat", pas de h2, ...
==>Le script ne marche pas

Citation:

Envoyé par foxrol

Code:

1
2
3
4
5
6
7
8
 
function liste()
{
var ol=document.createElement("ol");
var listeh2=document.getElementsByTagName("h2");
for (var i=0;i<listeh2.length;i++) 
(je suis perdu à ce niveau, j'arrive pas à faire la liste qui affiche le résultata)
}

A partir de la je je sais plus quoi faire.

je crois qu'en rajoutant ceci à ton code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
 
var ol=document.createElement("ol");
var listeh2=document.getElementsByTagName("h2")
for (var i=0;i<listeh2.length;i++) {
 
  var toto=listeh2.firstChild;//on recupere le contenu de h2(le texte)
  var nouveauLI = document.createElement("li");
  nouveauLI.appendChild(toto);
  ol.appendChild(nouveauLI);
}
//-->

ça devrait marché... :mouarf:

18/12/2006, 17h15
FMaz

Meme si l'appel à la fonction est clairement fait APRÈS le début du body, le navigateur parse la totalité du script avant même de respecter l'ordre d'exécution ?
18/12/2006, 17h23
landryx

j'ai pas compris la question??:? ..
18/12/2006, 17h30
FMaz

Bah par rapport à l'exemple de code donné et au commentaire suivant:

Citation:

Envoyé par FremyCompany

Non, au momment ou le script s'exécute, le div n'existe pas encore...
18/12/2006, 17h32
FremyCompany

Citation:

Envoyé par FMaz

Meme si l'appel à la fonction est clairement fait APRÈS le début du body, le navigateur parse la totalité du script avant même de respecter l'ordre d'exécution ?

Un code exécuté dans le flux (pas d'évent, de timer, ...) se fait dans le flux et bloque la suite de parsage HTML... (pour permettre les document.write et tout ca)