5602


見出しタグ`<h2>,<h3>`などから目次を生成し、ページ内にリンクを張りたいと考えています。  
JS等で自動で生成するにはどうしたらいいでしょうか？


CC BY-SA 3.0
2015-01-30T03:33:00.667
5601
2015-02-04T02:35:31.890
2015-02-04T02:35:31.890
525
525
question
html
見出しタグから目次を作りたい


jSで実装した場合には下記のような形になります。

[code]

    $(function(){// H2~H4タグから目次を自動生成
        var idcount = 1;
        var toc = '';
        var currentlevel = 0;
        $("h2,h3,h4:header", $("#article")).each(function(){
            this.id = "chapter-" + idcount;
            idcount++;
            var tag = this.nodeName.toLowerCase();
            var level = 0;
            if( tag == "h2") {
                level = 1;
            }else if( tag == "h3") {
                level = 2;
            } else if( tag == "h4") {
                level = 3;
            }
            while(currentlevel < level) {
                toc += '<ol class="chapter">';
                currentlevel++;
            }
            while(currentlevel > level) {
                toc += "<\/ol>";
                currentlevel--;
            }
            toc += '<li><a href="#' + this.id + '">' + $(this).html() + "<\/a><\/li>\n";
    
        });
        while(currentlevel > 0) {
            toc += "<\/ol>";
            currentlevel--;
        }
        $("#index").html(toc);
    });
    
[/code]


CC BY-SA 3.0
2015-01-30T03:33:00.667
5602
2015-01-30T03:33:00.667
525
5601
answer