简书自动生成目录小工具脚本

注:本篇所讲代码已失效，简书生成目录 新的方式参考：https://www.jianshu.com/p/c9eb0ebed253

1.首先参考安装 Tampermonkey：https://www.jianshu.com/p/caa21e6796bd

2.简书自动生成目录小工具脚本

升级版脚本地址（简书网站左侧目录生成脚本）：https://www.jianshu.com/p/0ab2b77f59a1

// ==UserScript==
// @name         简书自动生成目录小工具
// @name:zh-CN   简书目录
// @description:zh-CN 自动插入目录
// @namespace    https://github.com/lucid-lynxz
// @version      0.1
// @description  try to take over the world!
// @author       Lynxz
// @match        http://www.jianshu.com/p/*
//// @require      http://code.jquery.com/jquery-latest.js
// @grant        none
// ==/UserScript==
// 简书文章自动插入目录的脚本,用于tampermonkey
// 简书已自带jquery了,不需要添加此依赖
var menuIndex = 0;
var firstPaddingOrder = 1; //第一个标题行标签层级 <h1> -> 1  , <h2> -> 2, 第一个层级不用缩进

function scrollToView(id) {
    var element = $("#" + id)[0];
    console.log(id + " \n" + element);
    //            document.getElementById(id).scrollIntoView();
    element.scrollIntoView();
}

// 在侧边栏中添加目录项
function appendMenuItem(tagName, id, content) {
    let paddingLeft = (tagName.substring(1) - firstPaddingOrder) * 20;
    //$('#menu_nav_ol').append('<li class="' + id +  '" style="list-style:none;padding-left: '+ paddingLeft +'px;">' + content + '</li>');
    $('#menu_nav_ol').append('<li class="' + id + '" style="padding-left: ' + paddingLeft + 'px;">' + content + '</li>');
    //$('#menu_nav_ol').append('<li class="' + id +'" style="padding-left: '+ paddingLeft +'px;"><a href="#'+id+'">' + content + '</a></li>');
}

(function () {
    'use strict';
    let titles = $('body').find('h2,h3,h4,h5,h6');
    if (titles.length == 0) {
        return;
    }
    // 在 body 标签内部添加 aside 侧边栏,用于显示文档目录
    $('.show-content').prepend('<aside id="sideMenu" style="width: 100%; padding: 0px 15px 5px 15px;margin-bottom:20px;background-color: #dedede">目录</aside>');
    $('#sideMenu').append('<ol id="menu_nav_ol" style="list-style:none;margin:0px;padding:0px;">');// 不显示 li 项前面默认的点标志, 也不使用默认缩进

    // 获取文章中除标题外的第一个目录行层级
    let firstElement = titles.first();
    let firstTagName = firstElement[0].tagName;
    firstPaddingOrder = parseInt(firstTagName.substring(1));
    // 遍历文章中的所有标题行, 按需添加id值, 并增加记录到目录列表中
    titles.each(function () {
        let tagName = $(this)[0].tagName.toLocaleLowerCase();
        let content = $(this).text();
        // console.log('oriId = '+$(this).attr('id') + '\t menuIndex = ' + menuIndex);
        // 若标题的id不存在,则使用新id
        let newTagId = $(this).attr('id');
        if (!$(this).attr('id')) {
            newTagId = 'id_' + menuIndex;
            $(this).attr('id', newTagId);
            menuIndex++;
        }
        // console.log('newId = ' +newTagId);
        appendMenuItem(tagName, newTagId, content);
    });

    $('#sideMenu').append('</ol>');
    // 绑定目录li点击事件,点击时跳转到对应的位置
    $('#menu_nav_ol li').on('click', function () {
        let targetId = $(this).attr('class');
        //            document.getElementById(id).scrollIntoView();
        $("#" + targetId)[0].scrollIntoView(true);
    });
})();