Creer sommaire avec DOM

alphon5o -  
 alphon5o -
Bonjour,
je souhaite generer depuis un document html simple un sommaire:
- dans mon document les titres des chapitres sont des h1
- les sous-chapitres des h2
pour le moment je reussi a traiter les chapitres uniquement (les h1).
voici un exple de mon code: 
<html>
    <head>
        <title>......</title>
        <script type="text/javascript">
            function genereSommaire(){
               
                var sommaire = document.getElementById('sommaire');
                var content = document.getElementById('content');
                var allH1 = content.getElementsByTagName('h1');
                var nbH1 = allH1.length;
                var i = 0;
                while( i < nbH1){
                    var myI = ((i+1) < 10)?'0'+(i+1):(i+1);
                    alert(allH1[i]);
                    var hrf = allH1[i].childNodes[0];
                    var txt = ' ' + hrf.innerHTML;
                    var a = document.createElement('a');
                    a.setAttribute('href',hrf);
                    a.setAttribute('style','color:blue; font:bold 12pt Helvetica, Arial;');
                    label = document.createTextNode(myI + '. ' + txt);
                    a.appendChild(label);
                    var br = document.createElement('br');
                    sommaire.appendChild(a);
                    sommaire.appendChild(br);
                    i++;
                }
                var hr = document.createElement('hr');
                hr.setAttribute('style', 'margin: 20px 0;');
                sommaire.appendChild(hr);
            }
        </script>
    </head>
    <body onload="genereSommaire();" id="debut">
        <div id="monCours">
            <h1 id="titreCours">.........</h1>
            <div id="sommaire"><br /></div>
            <div id="content">
                <div class="chapitre">
                    <h1 class="titreChap" id="chap1"><a name="chap1" href="#chap1">.... 1</a><span style="float:right;clear:both;"><a href="#debut">debut</a></span></h1>
                    <p class="contentChap" id="chap1">
                    ......
                    ......
                    ......
                    </p>
                </div>
                <div class="chapitre">
                    <h1 class="titreChap" id="chap2"><a name="chap2" href="#chap2">.... 2</a><span style="float:right;clear:both;"><a href="#debut">debut</a></span</h1>
                    <p class="contentChap" id="chap2">
                    ......
                    ......
                    ......
                    </p>
                </div>
                <div class="chapitre">
                    <h1 class="titreChap" id="chap3"><a name="chap3" href="#chap3">.... 3</a><span style="float:right;clear:both;"><a href="#debut">debut</a></span</h1>
                    <p class="contentChap" id="chap3">
                    ......
                    ......
                    ......
                    </p>
                </div>
            </div>
        </div>
    </body>
</html>

maintenant je voudrai pouvoir traiter les sous chapitre aussi c'est a dire les "h2" mais je coince sur la fonction:
l'idée serai d'etre capable, quand on est dans un h1, de recuperer tous les h2 enfants de h1 courant et de creer les liens correspondants juste apres le h1 dans le sommaire.
exple:
1. chap1
2. chap2
3. chap3 # a supposer que celui contient des sous-chapitre alors
3.1 sous-chap 3.1
3.2 sous-chap 3.2
4. chap 4
.....
je compte alors sur votre aide pour me guider vers la solution; merci d'avance

1 réponse

Réponse 1 / 1
alphon5o
 
[resolu]
0