☰

csdn.net CSDN博客目录列表

辅助CSDN跳转列表插件

  1. // ==UserScript==
  2. // @name         csdn.net CSDN博客目录列表
  3. // @namespace    https://www.jianshu.com/u/15893823363f
  4. // @version      3.2
  5. // @description  辅助CSDN跳转列表插件
  6. //https://cdn.jsdelivr.net/npm/marked/marked.min.js
  7. //https://cdn.staticfile.org/jquery/3.3.1/jquery.min.js
  8. //https://code.createjs.com/1.0.0/tweenjs.min.js
  9. // @author       Zszen John
  10. // @match        https://blog.csdn.net/*/article/details/*
  11. // @grant        none
  12. // ==/UserScript==
  13.  
  14. (function() {
  15.     'use strict';
  16.     $("div#asideProfile").hide();
  17.     $("aside").hide();
  18.     $(".csdn-tracking-statistics").hide();
  19.     $("a.article-footer-btn").click();
  20.     $("div.recommend-box").hide();
  21.     let isDebug = 1
  22.     let poolLink = [];
  23.     document.title = '';
  24.     setTimeout(function () {
  25.         let div = $('<div id="zszen_jianshu" class="CSDN列表" style="border-radius:5px;font-size:13;line-height:17px;overflow:hidden; position:fixed; left:10%; top:9%; z-index:9999;height: 25px; width: 53px;border:3px solid #00CBA0;background-color:#ffffff"></div>');
  26.         $('body').append(div);
  27.         let title = $('<h4 id="title_jianshu" style="text-align:left;width:500%;line-height:13px;margin-bottom:2px;margin-top:2pxpx;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:#00CBA0;font-size:13px">目录</font></h4>');
  28.         div.append(title);
  29.         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>
  30.         div.append(items);
  31.         document.title = $('h1.title-article').html();
  32.         if(document.title.length>8){
  33.             document.title = document.title.substr(0,10)+'..';
  34.         }
  35.         // for(let i=1;i<=7;i++){
  36.         //     $('h'+i).not((idx,el)=>{return $(el).attr('class')!=undefined || $(el).attr('id')}).each(function(idx,el){
  37.         //         $(el).attr('id','h'+i+'_'+idx)
  38.         //     });
  39.         //     //DLOG('id','h'+i+'_'+idx);
  40. 		// }
  41.         //let oldIndent = 999;
  42.         let oldItems = [items];
  43. 		//$('h1,h2,h3,h4,h5,h6,h7').not('.title').not('#title_jianshu').
  44.         $('div.blog-content-box').find('h1,h2,h3,h4,h5,h6,h7,strong').not((idx,el)=>{return $(el).attr('class')!=undefined || $(el).attr('id')}).each(function(idx,el){
  45.             let indent = getTagLevel(el);
  46. 			let idName = 'h'+indent+'_'+idx;
  47. 			$(el).attr('id',idName);
  48.             DLOG(indent);
  49.             let unit = $('<li indent="'+indent+'" style="line-height:18px;align:left"></li>');//;font-size:12px
  50.             let link = $('<a focus="'+idName+'">'+$(el).text()+'</a>');
  51.             unit.append(link);
  52.             //DLOG('>>>',link);
  53.             link.on('mouseover',(evt)=>{
  54.                 DLOG(evt.currentTarget);
  55.                 evt.currentTarget.style.color = '#00CBA0';
  56.                 evt.currentTarget.style.fontWeight = 600;
  57.             });
  58.             link.on('mouseout',(evt)=>{
  59.                 evt.currentTarget.style.color = '#333333';
  60.                 evt.currentTarget.style.fontWeight = 100;
  61.             });
  62.             link.on('click',(evt)=>{
  63.                 let bt = $(evt.currentTarget);
  64.                 let target = $('#'+bt.attr('focus'));
  65.                 let motionTo = target.offset().top-60;
  66.                 //createjs.Tween.get($(document)).to({alpha:1}, 1000);//.call(handleComplete);
  67.                 $('body,html').animate({scrollTop: motionTo}, 'normal', 'swing');
  68.             });
  69.             DLOG(unit.attr('indent'))
  70.             let lastEl = null;
  71.             for(let i=oldItems.length-1;i>=0;i--){
  72.                 lastEl = oldItems[i];
  73.                 let distance = (oldItems.length-1)*6
  74.                 if(i>0){
  75.                     let lastIndent = parseInt(lastEl.attr('indent'));
  76.                     DLOG(i,indent,lastIndent);
  77.                     if(indent<=lastIndent){
  78.                         oldItems.pop();
  79.                         continue;
  80.                     }else{
  81.                         unit.css({'text-indent':distance+'px','font-size':Math.max(15-i*2,11)+'px','font-weight':'100'})
  82.                         lastEl.append(unit);
  83.                         oldItems.push(unit);
  84.                     }
  85.                 }else{
  86.                     unit.css({'text-indent':distance+'px','font-size':Math.max(15-i*2,11)+'px','font-weight':'100'})
  87.                     lastEl.append(unit);
  88.                     oldItems.push(unit);
  89.                 }
  90.                 break;
  91.             }
  92. 			//oldIndent = indent;
  93. 		});
  94.  
  95.         //$(window).resize(updateWin);
  96.         updateWin();
  97.  
  98.         //showList();
  99.         //showList();
  100.         // recursivelySelf(1);
  101.         // DLOG(poolLink);
  102.     },1000);
  103.  
  104.     // function recursivelySelf(level){
  105.     //     if(level>6)return;
  106.     //     $('h'+level).not('.title').each(function(idx,el){
  107.     //         poolLink.push($(el).html());
  108.     //         recursivelySelf(level+1);
  109.     //     })
  110.     // }
  111.  
  112.     function getTagLevel(el){
  113.         let indent = 0;
  114.         if($(el)[0].tagName=='STRONG'){
  115.             indent = 6;
  116.         }else{
  117.             indent = parseInt($(el)[0].tagName[1]);
  118.         }
  119.         return indent;
  120.     }
  121.  
  122.     function updateWin(){
  123.         let div = $('div#zszen_jianshu');
  124.         if($(window).width()<0){
  125.             hideList();
  126.             div.on('mouseover',showList)
  127.             div.on('mouseout',hideList)
  128.         }else{
  129.             showList();
  130.             div.off('mouseover',showList)
  131.             div.off('mouseout',hideList)
  132.         }
  133.     }
  134.  
  135.     function showList(){
  136.         //DLOG(document.title);
  137.         let h = $('div#zszen_jianshu').find('ol#itemList_jianshu').height()+$('h4#title_jianshu').height()+30;
  138.         $('h4#title_jianshu').css({'text-align':'left',width:'500%'})
  139.         $('h4#title_jianshu').children().html(document.title);
  140.         $('div#zszen_jianshu').css({width:'155px',height:h+'px'})
  141.         $('div#zszen_jianshu').find('font#title').css({'font-size':'16px'})
  142.         $('div#zszen_jianshu').find('ol#itemList_jianshu').show();
  143.     }
  144.  
  145.     function hideList(){
  146.         $('h4#title_jianshu').children().html('目录');
  147.         $('h4#title_jianshu').css({'text-align':'center',width:'100%'})
  148.         $('div#zszen_jianshu').css({width:'53px',height:'30px'})
  149.         $('div#zszen_jianshu').find('font#title').css({'font-size':'13px'})
  150.         $('div#zszen_jianshu').find('ol#itemList_jianshu').hide();
  151. 	}
  152.  
  153.     function DLOG(...args){
  154.         args.unshift('[DEBUG]:')
  155.         if(isDebug) console.log.apply(this,args);
  156.     }
  157.  
  158.     // Your code here...
  159. })();