使用jQuery给网页自动生成二级导航目录

自己有一个分章节的网页，类似百度百科的词条页面，就做了个二级导航目录。你只需把导航目录代码content放在需要的位置即可。

var jquery_h3_list = $('h3');//如果你的章节标题不是h3,只需要将这里的h3换掉即可
    if(jquery_h3_list.length>0)
    {
        var content = '';
        //content    += '<ul style="list-style-type:none;text-align: left;margin:2px 2px;">';
        for(var i =0;i<jquery_h3_list.length;i++)
        {
            //var go_to_top = '<div style="text-align: right"><a name="_lab' + i + '"></a></div>';
			var go_to_top = '<a name="_lab' + i + '"></a>';
            $(jquery_h3_list[i]).before(go_to_top);
            var jquery_h4_list = $(jquery_h3_list[i]).nextUntil(jquery_h3_list[i+1], "h3");
            if(jquery_h4_list.length>0)
            {
                var li_content = '<li class="dropdown"><a href="#_lab' + i + '" class="dropdown-toggle" data-toggle="dropdown">' + $(jquery_h3_list[i]).text() + '</a>';
                //var jquery_h4_list = $(jquery_h3_list[i]).nextUntil(jquery_h3_list[i+1], "h3");
				li_content +='<ul class="dropdown-menu">';
            }
			else{
				var li_content = '<li class="dropdown"><a href="#_lab' + i + '" >' + $(jquery_h3_list[i]).text() + '</a>';
            //var jquery_h4_list = $(jquery_h3_list[i]).nextUntil(jquery_h3_list[i+1], "h3");
			}
            for(var j = 0;j < jquery_h4_list.length;j++)
            {
                //var go_to_top2 = '<div style="text-align: right"><a name="_lab2'+ i + j + '"></a></div>';
				var go_to_top2 = '<a name="_lab2'+ i + j + '"></a>';
                $(jquery_h4_list[j]).before(go_to_top2);
                li_content +='<li><a href="#_lab2'+ i + j + '">' + $(jquery_h4_list[j]).text() + '</a></li>';
            }
            if(jquery_h4_list.length>0)
            {
                li_content +='</ul>';
            }
            li_content +='</li>';
            content += li_content;
        }

需要说明的是，代码参考了互联网上另一位作者的。Ta写的是为某博客写的类似插件的
代码，我在此基础上进行了修改，并对添加了对Bootstrap的适应。由于Ta的博客已声明停更，不能保证链接稳定性，就不附链接了，有需要的自行百度查找。也欢迎大家将此代码修改优化后发布。

代码及本文采用GNU General Public License v3.0协议进行开源。

点此支持作者