<h*>タグを一斉にチェックできないでしょうか

質問

お世話になります。
<h4 id="01" title="１章">第１章</h4>
　<h5 id="01_01" title="1-1">１－１</h5>
　<h5 id="01_02" title="1-2">１－２</h5>
　　<h6 id="01_02_01" title="1-2-1">１－２－１　　　</h6>
　<h5 id="01_03" title="1-3|<br>">１－３</h5>
<h4 id="02" title="２章">第２章</h4>
と、いうようにhtmlを書いて、

function HTagItem(ID,TitleOrg){
this.ID=ID;
this.TitleOrg=TitleOrg;
this.Href='<a href="#'+ID+'">'+TitleOrg+'</a>';
}
と、関数を定義し、
Menu_HTag = new Aray(
new HTagItem('01','１章'),
new HTagItem('01_01','1-1'),
new HTagItem('01_02','1-2'),
new HTagItem('01_02_01','1-2-1'),
new HTagItem('01_03','1-3'),
new HTagItem('02','２章'),
);
と、いう配列を得たく苦慮しています。

obj=document.getElementsByTagName("h"+HNo)
で、HNoに順次４，５，６を代入してループを作り
Menu_HTagをIDでソートすればできます。
しかし、この方法だと<h*>タグのIDを常に意識していないと順番がhtmlに記載順で無くなってしまいます。
<h*>タグを途中に挿入したときなどIDを全て付け直す必要があります。これでは混乱してしまいます。

そこで、要はhtmlに書いた順番に<h*>タグの配列が作成できれば良いわけですので、<h4>を調べて次に<h5>を調べてというのでなく<h*>をhtmlに記載された順に一時に調べることはできないものでしょうか。
DOMとして階層を成しているパターンでも無いようですので行き詰まってしまいました。
どうかよろしくお願いいたします。

回答No.1

BLUEPIXY · ベストアンサー

http://www.doraneko.org/misc/dom10/19981001/level-one-core.html
getElementsByTagName
は、
getElementsByTagName("*")
で呼ぶと全てのタグのリストを返しますので、
そこからhで始まるものを抜き出せばいいかと思います。
例えば、
window.onload=function(){
var all = document.getElementsByTagName("*");
var len = all.length;
for(var i=0;i<len;i++){
if(all[i].tagName.match(/h\d/i)){
alert(all[i].id+","+all[i].title);
}
}
};
のようにしてid とtitle が取り出せます。
あとは、|<br>などを取り除く処理をして、
Menu_HTag = new Array();
…
Menu_HTag.push(new HTagItem(id,title));
のようにプッシュしていけばいいと思います。

お礼

お早うございます。
早速ありがとうございます。
できました。
getElementsByTagName("h*")
は、やってみたのですが、
getElementsByTagName("*")
は、気がつきませんでした。
どうもありがとうございました。