讓文章自動生成章節目錄索引的JS代碼
一個好的博文除了博文的質量要好以外,好的組織結構也能讓讀者閱讀的更加舒服與方便,有一些博文都是分章節的,并且在博文的前面都帶有章節的目錄索引,點擊索引之后會跳轉到相應的章節閱讀,并且還可以回到目錄頂端,當然這種結構如果是在寫博文的時候人工設置那是非常麻煩的,無疑是增加了寫作人的工作量。如果能自動生成章節索引豈不是節省了一大堆 工作量。
<script language="javascript" type="text/javascript">
//生成目錄索引列表
function GenerateContentList()
{
var jquery_h3_list = $('#post_body h3');//如果你的章節標題不是h3,只需要將這里的h3換掉即可
if(jquery_h3_list.length>0)
{
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>閱讀目錄</b></p>';
content += '<ul>';
for(var i =0;i<jquery_h3_list.length;i++)
{
var go_to_top = '<div style="text-align: right"><a href="#_labelTop">回到頂部</a><a name="_label' + i + '"></a></div>';
$(jquery_h3_list[i]).before(go_to_top);
var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
if($('#post_body').length != 0 )
{
$($('#post_body')[0]).prepend(content);
}
}
}
GenerateContentList();
</script>
本文由用戶 fn67 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!