自动生成博客目录

前面的话

　　有朋友在博客下面留言，询问博客目录是如何生成的。接下来就详细介绍实现过程

操作说明

　　关于博客目录自动生成，已经封装成catalog.js文件，只要引用该文件即可

  //默认地，为页面上所有的h3标签生成目录  <script src='/images/loading.gif' data-original="http://files.cnblogs.com/files/xiaohuochai/catalog.js"></script>  //或者，为页面上所有的标签生成目录  <script src='/images/loading.gif' data-original="http://files.cnblogs.com/files/xiaohuochai/catalog.js" data-seletor=".test"></script>

　　【功能简要说明】

　　1、点击目录项，对应章节标题将显示在可视区上方

　　2、滚动滚轮，目录项会对应章节标题的变化而相应地变化

　　3、点击目录右上角的关闭按钮，可以将目录缩小为"显示目录"四个字，双击缩小后的目录，可恢复默认状态

　　4、目录可以拖拽至任意地方

目录参照

　　首先，要确定的是，基于什么生成目录。是文章中的<h3>标签，还是文章中的的标签。所以，更人性化的做法是，将其作为参数，默认参数为<h3>标签

　　由于博客园的博文除了自己生成的博客内容外，博客园还会添加诸如评论、公告、广告等元素。所以，第一步要先定位博文

　　博文最终都处于id="cnblogs_post_body"的div中

原标题：自动生成博客目录

关键词：