辅助简书跳转列表插件，简书的markdown过于简陋，没有目录结构，这里做了个插件辅助。 增加了缓动，修正了因为顶部遮挡导致标签遮挡的问题
当前为
// ==UserScript==
// @name Jianshu.com 简书文章列表
// @namespace https://www.jianshu.com/u/15893823363f
// @version 3.6
// @description 辅助简书跳转列表插件，简书的markdown过于简陋，没有目录结构，这里做了个插件辅助。 增加了缓动，修正了因为顶部遮挡导致标签遮挡的问题
//https://cdn.jsdelivr.net/npm/marked/marked.min.js
//https://cdn.staticfile.org/jquery/3.3.1/jquery.min.js
//https://code.createjs.com/1.0.0/tweenjs.min.js
// @author Zszen John
// @match https://www.jianshu.com/p/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
let isDebug = 0
let poolLink = [];
document.title = '';
setTimeout(function () {
let div = $('<div id="zszen_jianshu" class="简书列表" style="border-radius:5px;font-size:13;line-height:17px;overflow:hidden; position:fixed; left:2%; top:9%; z-index:9999;height: 25px; width: 53px;border:3px solid #65E1FF;background-color:#ffffff"></div>');
$('body').append(div);
let title = $('<h4 id="title_jianshu" style="text-align:left;width:500%;line-height:13px;margin-bottom:2px;margin-top:2px;line-height:1;padding-left:2px;padding-top:0px;-webkit-margin-before:.3em;-webkit-margin-after:.3em;-webkit-margin-start: 0px;-webkit-margin-end: 0px;font-weight: bold;"><font id="title" style="font-weight:800;color:#65E1FF;font-size:13px">目录</font></h4>');
div.append(title);
title.on('click',(evt)=>{
let target = $('h1.title');
$('body,html').animate({scrollTop: target.offset().top-60}, 'normal', 'swing');
});
let items = $('<ol id="itemList_jianshu" style="width:300%;align:left;line-height:16px;text-align:left;padding-left:7px;padding-top:0px;color:#8B8E85"/>');//<font style="font-size:12px;color:#68ac10">{{item.title}}</font>
div.append(items);
document.title = beautySub($('h1.title').text(),6);
//if(document.title.length>8){
// document.title = document.title.substr(0,8)+'..';
//}
// for(let i=1;i<=7;i++){
// $('h'+i).not('.title').not('#title_jianshu').each(function(idx,el){
// $(el).attr('id','h'+i+'_'+idx)
// });
// //DLOG('id','h'+i+'_'+idx);
// }
//let oldIndent = 999;
let oldItems = [items];
//DLOG($('h1').not((idx,el)=>{return false}));
let maxLen = 20;
let tags = ('h1,h2,h3,h4,h5,h6,h7,strong,b').split(',');
let list = null;
while(tags.length>0){
let tagStr = tags.join(',');
list = $(tagStr).not((idx,el)=>{return $(el).attr('class')!=undefined || $(el).attr('id')})
//.not('.title').not('#title_jianshu').not('[align="center"]');
if(list.length<=maxLen){
break;
}
tags.pop();
}
if(!list || list.length==0){
return;
}
list.each(function(idx,el){
//poolLink.push($(el).html());
let indent = getTagLevel(el);
let idName = 'h'+indent+'_'+idx;
// let indent = parseInt($(el)[0].tagName[1]);
$(el).attr('id',idName)
let unit = $('<li indent="'+indent+'" style="line-height:18px;align:left"></li>');//;font-size:12px
//let link = $('<a href="#'+$(el).attr('id')+'">'+$(el).html()+'</a>');
let lastEl = null;
let indentReal = 0;
for(let i=oldItems.length-1;i>=0;i--){
lastEl = oldItems[i];
let distance = (oldItems.length-1)*6
if(i>0){
let lastIndent = parseInt(lastEl.attr('indent'));
//DLOG(i,indent,lastIndent);
if(indent<=lastIndent){
oldItems.pop();
continue;
}else{
unit.css({'text-indent':distance+'px','font-size':Math.max(15-i*2,11)+'px','font-weight':'100'})
lastEl.append(unit);
oldItems.push(unit);
}
}else{
unit.css({'text-indent':distance+'px','font-size':Math.max(15-i*2,11)+'px','font-weight':'100'})
lastEl.append(unit);
oldItems.push(unit);
}
indentReal = i;
break;
}
//add link
let link = $('<a focus="'+idName+'">'+beautySub($(el).text(),8+(indentReal-1))+'</a>');
unit.append(link);
link.on('mouseover',(evt)=>{
evt.currentTarget.style.color = '#0F839E';
evt.currentTarget.style.fontWeight = 600;
});
link.on('mouseout',(evt)=>{
evt.currentTarget.style.color = '#333333';
evt.currentTarget.style.fontWeight = 100;
});
link.on('click',(evt)=>{
let bt = $(evt.currentTarget);
let target = $('#'+bt.attr('focus'));
let motionTo = target.offset().top-60;
//createjs.Tween.get($(document)).to({alpha:1}, 1000);//.call(handleComplete);
$('body,html').animate({scrollTop: motionTo}, 'normal', 'swing');
});
//oldIndent = indent;
});
createUnit('评论 :p',items,$('div.article').height()+$('div.article').offset().top+550);
$(window).resize(updateWin);
updateWin();
updateWin();
//setTimeout(updateWin,500);
//showList();
//showList();
// recursivelySelf(1);
// DLOG(poolLink);
},1000);
// function recursivelySelf(level){
// if(level>6)return;
// $('h'+level).not('.title').each(function(idx,el){
// poolLink.push($(el).html());
// recursivelySelf(level+1);
// })
// }
function beautySub(str, len) {
var reg = /[\u4e00-\u9fa5]/g, //专业匹配中文
slice = str.substring(0, len),
chineseCharNum = (~~(slice.match(reg) && slice.match(reg).length)),
realen = slice.length*2 - chineseCharNum;
return str.substr(0, realen) + (realen < str.length ? "..." : "");
}
function createUnit(content,el, motionTo){
let unit = $('<li style="line-height:18px;align:left;padding-top:4px;padding-bottom:4px;"></li>');
let link = $('<a>'+content+'</a>');
unit.append(link);
link.on('mouseover',(evt)=>{
evt.currentTarget.style.color = '#0F839E';
evt.currentTarget.style.fontWeight = 600;
});
link.on('mouseout',(evt)=>{
evt.currentTarget.style.color = '#333333';
evt.currentTarget.style.fontWeight = 100;
});
link.on('click',(evt)=>{
//let bt = $(evt.currentTarget);
//let target = $('#'+bt.attr('focus'));
// let motionTo = target.offset().top-60;
$('body,html').animate({scrollTop: motionTo}, 'normal', 'swing');
});
unit.css({'text-indent':0+'px','font-size':Math.max(15-2*1,11)+'px','font-weight':'100'})
el.append(unit);
}
function getTagLevel(el){
let indent = 0;
if($(el)[0].tagName=='STRONG'){
indent = 6;
}else if($(el)[0].tagName=='B'){
indent = 7;
}else if($(el)[0].tagName=='DIV'){
indent = 1;
}else{
indent = parseInt($(el)[0].tagName[1]);
}
return indent;
}
function updateWin(){
let div = $('div#zszen_jianshu');
if($(window).width()<970){
hideList();
div.on('mouseover',showList)
div.on('mouseout',hideList)
}else{
showList();
div.off('mouseover',showList)
div.off('mouseout',hideList)
}
}
function showList(){
//DLOG(document.title);
let h = $('div#zszen_jianshu').find('ol#itemList_jianshu').height()+50;
$('h4#title_jianshu').css({'text-align':'left',width:'500%'})
$('h4#title_jianshu').children().html(document.title);
$('div#zszen_jianshu').css({width:'155px',height:h+'px'})
$('div#zszen_jianshu').find('font#title').css({'font-size':'16px'})
$('div#zszen_jianshu').find('ol#itemList_jianshu').show();
}
function hideList(){
$('h4#title_jianshu').children().html('目录');
$('h4#title_jianshu').css({'text-align':'center',width:'100%'})
$('div#zszen_jianshu').css({width:'53px',height:'30px'})
$('div#zszen_jianshu').find('font#title').css({'font-size':'13px'})
$('div#zszen_jianshu').find('ol#itemList_jianshu').hide();
}
function DLOG(...args){
if(isDebug) console.log.apply(this,args);
}
// Your code here...
})();