markdown自动生成简书目录

给简书增加目录功能
目前为 2019-08-16 提交的版本。查看最新版本。
Wrap lines
// ==UserScript==
// @name                markdown自动生成简书目录
// @namespace           create-jianshuList
// @version             1.0
// @author              YIN
// @description         给简书增加目录功能
// @match               http://www.jianshu.com/p/*
// @match               https://www.jianshu.com/p/*
// @grant               none
// ==/UserScript==
 
//去除字符串所有空格
function trim (str, is_global) {
    var result;
    result = str.replace(/(^\s+)|(\s+$)/g, "");
    if (is_global&&is_global.toLowerCase() == "g") {
        result = result.replace(/\s/g, "");
    }
    return result;
}
 
//转义尖括号
function toTxt(str) {
    var RexStr = /\<|\>/g
    str = str.replace(RexStr, function(MatchStr) {
        switch (MatchStr) {
            case "<":
                return "&lt;";
                break;
            case ">":
                return "&gt;";
                break;
            default:
                break;
        }
    })
    return str;
}
var menuIndex = 0; //初始化标题索引
 
// 在侧边栏中添加目录项
function appendMenuItem(tagName,id,content) {
    console.log(tagName+" "+tagName.substring(1));
    let paddingLeft = tagName.substring(1) * 20; //添加标题缩进
    $('#menu_nav_ol').append('<li class=' + id + ' style="padding-left: '+ paddingLeft +'px;line-height:40px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"><a href=javascript:; title='+toTxt(trim(content,"g"))+' style="color:#e1e3e4">' + content + '</a></li>');
}
 
(function() {
    // 获取标题元素
    let titles = $('body').find('h1,h2,h3,h4,h5,h6');
    if(titles.length === 0) {
        return;
    }
    // 将文章内容右移
    $('.post').css({padding:'0 150px 0 400px',width:'100%'});
    // 在 body 标签内部添加 aside 侧边栏,用于显示文档目录
    let asideContent = '<aside id="sideMenu" style="font-size:15px;color:#fff;position: fixed;padding: 70px 15px 20px 0;top: 0;left: 0;margin-bottom:20px;background-color: #282c34;z-index: 810;overflow: auto;height:100%;width:320px;"></aside>';
    $('.show-content').prepend(asideContent);
    $('#sideMenu').append('<ol id="menu_nav_ol" style="list-style:none;margin:0px;padding:0px;">');// 不显示 li 项前面默认的点标志, 也不使用默认缩进
 
    // 遍历文章中的所有标题行, 按需添加id值, 并增加记录到目录列表中
    titles.each(function() {
        let tagName = $(this)[0].tagName.toLocaleLowerCase();
        let content = $(this).text();
        // 若标题的id不存在,则使用新id
        let newTagId =$(this).attr('id');
        if(!$(this).attr('id')) {
            newTagId = 'id_'+menuIndex;
            $(this).attr('id',newTagId);
            menuIndex++;
        }
        if(newTagId !=='id_0') //忽略标题
            appendMenuItem(tagName,newTagId,content);
    });
 
    $('#sideMenu').append('</ol>');
    // 绑定目录li点击事件,点击时跳转到对应的位置
    $('#menu_nav_ol li').on('click',function() {
        let targetId = $(this).attr('class');
        var _top=$("#"+targetId).offset().top-$("#"+targetId).outerHeight(true)-10
        $('html,body').animate({
            scrollTop:_top
        }, 300);
 
    });
})();
欢迎访问Greasy Fork镜像
