文章目錄自動生成器

文章目錄自動生成器

相似於segmentfault和掘金的文章目錄，無第三方依賴的，自動生成文章目錄結構，靈活配置

demo地址

<!-- 文章容器 -->
<div id="kCatelog"></div>
<!-- 目錄容器 -->
<div class="k-catelog-list" id="catelogList"></div>
複製代碼

new Katelog({
    contentEl: 'kCatelog',
    catelogEl: 'catelogList',
    linkClass: 'k-catelog-link',
    linkActiveClass: 'k-catelog-link-active',
    supplyTop: 20,
    selector: ['h2', 'h3'],
    active: function (el) {
        console.log(el);
    }
});
複製代碼

支持IE8以上和主流的瀏覽器

選項

contentEl

文章容器，id選擇器

catelogEl

目錄容器，id選擇器

linkClass

每一個目錄項的類

linkActiveClass

當前激活的目錄項的類

selector（可選）

選擇目錄的標題元素，默認支持6級樹形結構

默認值: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']

selector: ['h2', 'h3']
複製代碼

supplyTop（可選）

每一個目錄須要補充的高度，好比fixed頭部佈局會擋住實現，能夠設置supplyTop來修正

若是您喜歡這個插件，給個star吧！github