Markdown pad导出html 带目录

在工具-选项-高级-html head编辑器中加入如下代码
最新方式<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://yandex.st/highlightjs/6.2/highlight.min.js"></script>

<script>hljs.initHighlightingOnLoad();</script>
<script type="text/javascript">
$(document).ready(function(){
$("h2,h3,h4,h5,h6").each(function(i,item){
var tag = $(item).get(0).localName;
$(item).attr("id","wow"+i);
$("#category").append('<a class="new'+tag+'" href="#wow'+i+'">'+$(this).text()+'</a></br>');
$(".newh2").css("margin-left",0);
$(".newh3").css("margin-left",20);
$(".newh4").css("margin-left",40);
$(".newh5").css("margin-left",60);
$(".newh6").css("margin-left",80);
});

$(".book-body").html($(".book-body").nextAll())
});
</script>
<style type="text/css">

@media (max-width: 1600px) {
.book-body {
padding-left:200px;
}
}

@media (max-width: 1400px) {
.book-body {
padding-left:200px;
}
}

@media (max-width: 1200px) {
.book-body {
padding-left:300px;
}
}
@media (max-width: 700px) {
.book-body {
padding-left:0px;
}
}
@media (min-width: 700px) {
#category{
position: fixed;
left: 20px;
top:0;
height: 100%;
overflow-y: scroll;
}
}

@media (-webkit-max-device-pixel-ratio: 1) {
::-webkit-scrollbar-track-piece {
background-color:#FFF
}

::-webkit-scrollbar {
width: 6px;
height: 6px
}

::-webkit-scrollbar-thumb {
background-color: #c2c2c2;
background-clip: padding-box;
min-height: 28px
}

::-webkit-scrollbar-thumb:hover {
background-color: #A0A0A0
}
}
</style>
<a href="javascript:scroll(0,0)" style="position:fixed;float:right;right:32px;top:30%">返回顶部</a>
<div id="category" class="book-summary"></div>
<div class="book-body">
</div>

方式一
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
var div1 = document.createElement("div");
div1.style.cssText = "clear:both";
// 生成目录列表
var outline = document.createElement("div");
outline.setAttribute("id", "outline-list");
outline.style.cssText = "border:solid 1px #ccc; background:#eee; min-width:200px;padding:4px 10px;";

var ele_p = document.createElement("p");
ele_p.style.cssText = "text-align: left; margin: 0;";
outline.appendChild(ele_p);

var ele_span = document.createElement("span");
// ele_span.style.cssText = "float: left;";
var ele_text=document.createTextNode("目录");
ele_span.appendChild(ele_text);

var ele_a = document.createElement("a");
ele_a.appendChild(document.createTextNode("[+]"));
ele_a.setAttribute("href", "#");
ele_a.setAttribute("onclick", "javascript:return openct(this);");
ele_a.setAttribute("title", "点击打开目录");

ele_span.appendChild(ele_a);
ele_p.appendChild(ele_span);

var ele_ol = document.createElement("ol");
ele_ol.style.cssText = "display:none;margin-left:14px;padding-left:14px;line-height:160%;";
ele_ol.setAttribute("id", "outline_ol");
outline.appendChild(ele_ol);
var div1 = document.createElement("div");
div1.style.cssText = "clear:both";

document.body.insertBefore(outline, document.body.childNodes[0]);
// 获取所有标题
var headers = document.querySelectorAll('h1,h2,h3,h4,h5,h6');
if (headers.length < 2)
return;

// -----
var old_h = 0, ol_cnt = 0;
// -----

for (var i = 0; i < headers.length; i++) {

var ele_ols = null;
// 找出它是H几，为后面的有序列表做准备
var header = headers[i];
header.setAttribute("id", "t" + i + header.tagName);
var h = parseInt(header.tagName.substr(1), 10);
// -----
if (!old_h){
old_h = h;
}

if (h > old_h) {
ele_ols = document.createElement("ol");
var ele_Current = ele_ol;
if(ele_Current && ol_cnt > 0){
var temp = ol_cnt;
while(temp > 0){
ele_Current = ele_Current.lastChild;
temp--;
}
}
ele_Current.lastChild.appendChild(ele_ols);
ol_cnt++;
} else if (h < old_h && ol_cnt > 0) {
if (h == 1) {
while (ol_cnt > 0) {
ol_cnt--;
}
} else {
ele_ols = document.createElement("ol");
var ele_Current = ele_ol;
if(ele_Current && ol_cnt > 0){
var temp = ol_cnt;
while(temp > 1){
ele_Current = ele_Current.lastChild;
temp--;
}
}
ele_Current.appendChild(ele_ols);

ol_cnt--;
}
}
if (h == 1) {
while (ol_cnt > 0) {
ol_cnt--;
}
}
old_h = h;
// -----
if (ele_ols){
ele_li = document.createElement("li")
ele_ols.appendChild(ele_li);
} else {
ele_li = document.createElement("li")
ele_ol.appendChild(ele_li);
}

var a = document.createElement("a");
// 为目录项设置链接
a.setAttribute("href", "#t" + i + header.tagName);
// 目录项文本
a.innerHTML = header.textContent;

ele_li.appendChild(a);
}
// -----
while (ol_cnt > 0) {
ol_cnt--;
}
// -----

});
// 代开和关闭目录的函数
function openct(e) {
if (e.innerHTML == '[+]') {
// createTextNode
e.setAttribute('title', '收起');
e.innerHTML = '[-]';
var element = document.getElementById("outline_ol");
element.style.cssText = "margin-left:14px;padding-left:14px;line-height:160%;";
} else {
e.setAttribute('title', '展开');
e.innerHTML = '[+]';
var element = document.getElementById("outline_ol");
element.style.cssText = "display:none;margin-left:14px;padding-left:14px;line-height:160%;";
}
e.blur();
return false;
}
</script>
方式二

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://yandex.st/highlightjs/6.2/highlight.min.js"></script>

<script>hljs.initHighlightingOnLoad();</script>
<script type="text/javascript">
$(document).ready(function(){
$("h2,h3,h4,h5,h6").each(function(i,item){
var tag = $(item).get(0).localName;
$(item).attr("id","wow"+i);
$("#category").append('<a class="new'+tag+'" href="#wow'+i+'">'+$(this).text()+'</a></br>');
$(".newh2").css("margin-left",0);
$(".newh3").css("margin-left",20);
$(".newh4").css("margin-left",40);
$(".newh5").css("margin-left",60);
$(".newh6").css("margin-left",80);
});
});
</script>
<a href="javascript:scroll(0,0)" style="position:fixed;float:right;right:32px;top:30%">返回顶部</a>
<div id="category"></div>