动态显示目录的作用
不用每次写博客的时候繁琐的人工整理目录，又可以动态浮动在右下角，方便快速跳到感兴趣的位置同时也可以快速的对文章内容有一个大概的了解。
实现原理
首先根据个人喜好，我习惯了用 h1 来做分类。所以本篇内容也主要是针对h1来提取目录。
如何提取出来h1呢？
先来看这张图，以猎豹浏览器为例：
首先在博客内容第一行点击鼠标右键，然后选择检查。这时会弹出右边的框，直接定位到我的h1标签，就这么简单的找到了它的父级 cnblogs_post_body 。
然后使用 jquery 选择器 来获取到这些h1，对jquery选择器不熟的直接跳这个链接温习一下：http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp
$('#cnblogs_post_body h1')就这么简单的一个括号就完成了对 h1 的提取。
在遍历所有的h1，取出内容之前，我们需要一个目录的容器。
$('#cnblogs_post_body').append('<div id="blog_catalog" class="blog_catalog"><ul><li><a id="blog_catalog_close" class="blog_catalog_close">>折叠目录</a></li></ul></div>');这句简单解释就是在博客内容最末尾插入了一个 div，里面包含ul和一个默认的li 用于折叠目录。
接下来就要提取h1的内容了，但在这个过程中我们还要做一件事，就是自动给h1增加一个id，作为一个标准的懒人，我肯定连h1的id都不想写的，自动生成神马的最好了。
延伸阅读
- ssh框架 2016-09-30
- 阿里移动安全 [无线安全]玩转无线电——不安全的蓝牙锁 2017-07-26
- 消息队列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 论文笔记【图片目标分割】 2017-07-26
- 词向量-LRWE模型-更好地识别反义词同义词 2017-07-26
- 从栈不平衡问题 理解 calling convention 2017-07-26
- php imagemagick 处理 图片剪切、压缩、合并、插入文本、背景色透明 2017-07-26
- Swift实现JSON转Model - HandyJSON使用讲解 2017-07-26
- 阿里移动安全 Android端恶意锁屏勒索应用分析 2017-07-26
- 集合结合数据结构来看看(二) 2017-07-26
学习是年轻人改变自己的最好方式