CSDN Blog 极致简化

去除作者信息面板、广告,评论区移至左侧 & 免登陆查看评论, 免登录复制, 自动阅读全文, 去除登陆弹窗(如需登陆点右上角)

当前为 2022-09-04 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         CSDN Blog 极致简化
// @name:en   CSDN Blog Super Simplification
// @namespace    csdn_blog_super_simplification
// @version      4.1.1
// @description  去除作者信息面板、广告,评论区移至左侧 & 免登陆查看评论, 免登录复制, 自动阅读全文, 去除登陆弹窗(如需登陆点右上角)
// @description:en  remove author panel/remove ads/move comment area to left & remove login requirement/auto trigger read more button/hide login pop up panel
// @author       Xavier Wong
// @run-at       document-start
// @include      https://*blog.csdn.net/*
// @exclude      https://www.csdn.net/*
// @grant        GM_addStyle
// @license      Xavier Wong
// ==/UserScript==

GM_addStyle(
    '#commentSideBoxshadow{display:block !important;width:unset !important;}' +
    '#commentSideBoxshadow>.comment-side-content{right: unset !important; top: 48px !important; margin-top: 8px !important;height:calc(100% - 68px) !important;overflow: hidden !important; width:30% !important}' +
    '.comment-side-tit-close{display: none !important}' +
    '.comment-side-box-shadow{position: static !important; height: unset !important}' +
    '#pcCommentSideBox{height: 100% !important;overflow-y:scroll !important; padding: 0 !important}' +
    // Background & Color
    '[id^="dmp_ad"] {display:none}'+
    '#csdn-toolbar{position:static !important}'+
    '.toolbar-inside{background: #fff !important}' +
    '.toolbar-container{width: fit-content !important}'+
    '.toolbar-search{width: auto !important;flex: unset !important}'+
    '#mainBox{margin-left: 0 !important; width:100% !important;overflow:hidden;}' +
    'body{background-color:#f5f6f7 !important;background-image:none !important;  overflow-y:auto; overflow-x:auto}' +
    // Layout Rearrangement
    '.has-comment,.unhas-comment,#recommendNps,#csdn-shop-window,#toolBarBox,.reward-box-new,#rightAside,#btnMoreComment,#tip_comment,#quickComment,.hide-article-box,.csdn-side-toolbar,.recommend-box,.template-box,.footer-box,.blog-footer-bottom,aside,.toolbar-advert{display:none !important}' +
    '.main_father{height: calc(100% - 60px) !important;}' +
    '#article_content{width:100% !important;height:100% !important}' +
    'main{width:100% !important;height:100% !important;margin-bottom: unset !important}'+
    '.blog-content-box{width:70%;float:right;z-index:1;height: 100%;overflow-y: auto;-webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);}' +
    // Toolbox
    '.more-toolbox{width:98.5% !important;position:fixed !important;bottom:0;left:unset !important;-webkit-box-shadow: 0 0 10px 3px rgba(0,0,0,0.05);box-shadow: 0 0 10px 3px rgba(0,0,0,0.05);}' +
    // Comment Area
    '#pcCommentBox{display: block!important;margin-top:0px !important;position:relative;width:29% !important;height:100%;overflow:hidden;}' +
    '.comment-list-box{overflow-y:auto !important;height: 100%;max-height:unset !important;margin-bottom:10px !important;}' +
    '.comment-list-container{overflow:scroll !important;padding-bottom:57px}' +
    '#commentPage{top:15px;width:100%;margin-bottom:25px !important;display:block !important}' +
    '.bt-comment-show{display: none !important} .opt-box{display: block !important}' +
    '#myDrap>a{box-shadow: none;border: 1px solid #dadde0;} #myDrap>a>svg{color: #999aaa;width: 2rem;height: 2rem;} #comment_content{height:64px}' +
    '.comment-operate-box{bottom: 8px; top: unset !important}' +
    '.new-comment{display:block !important;text-align: justify;}'+
    // Login Box
    '.login-box,.login-mark{visibility:hidden !important}' +
    '#commentControl{position:absolute;right: 0; top:50%;width:30px;height:30px}' +
    '#hideCom{position:absolute;right:0;top:50%;line-height:50px;height:50px;width:25px;background:#f5f6f7;cursor:pointer;color:darkgrey;padding-left:10px;font-weight:bolder;border-radius:50px 0 0 50px}' +
    '#hideCom:hover{width:40px;}' +
    '#showCom{display:none;position:fixed;left:12px;top:50%;line-height:50px;height:50px;width:25px;background:#f5f6f7;cursor:pointer;color:darkgrey;padding-right:10px;text-align:end;font-weight:bolder;border-radius:0 50px 50px 0}' +
    '#showCom:hover{width:40px;}' +
    '#moveCom{position:absolute; right:0;top:0;width:0;height:0;border-top: 15px solid red;border-left: 15px solid transparent;cursor:move}' +
    '#resizeCom{display:none;position:absolute; right:0;bottom:0;width:0;height:0;border-bottom: 15px solid red;border-left: 15px solid transparent;cursor:nwse-resize}' +
    '.new-info-box{padding-right:0px !important}'+
    // Code Copy
    'code{user-select: text !important}'
);

function scrollToTop(){
    document.querySelector('.article-header-box').scrollIntoView()
}
function commentArea(toolbar, comment){
    if(toolbar.style.position !== comment.style.position){
        comment.style.position = toolbar.style.position;
    }
    if(comment.style.position === "fixed"){
        if(document.getElementsByTagName("main")[0].offsetWidth*0.28 !== comment.offsetWidth){
            comment.style.width = document.getElementsByTagName("main")[0].offsetWidth*0.28 + "px";
        }
    }else{
        comment.style.width = "28%";
    }
}
function scrollToTopF(){
    document.querySelector('.blog-content-box').scrollTo({
        left: 0,
        top: 0,
        behavior: 'smooth'
    });
}
function showComment(){
    let commentBox = document.querySelector('#pcCommentBox');
    commentBox.style.left = 'unset';
    commentBox.style.top = 'unset';
    commentBox.style.width = '29%';
    commentBox.style.height = '100%';
    GM_addStyle(".blog-content-box{width:70%} #showCom{display:none !important}");
}
(
    function() {
        var scrollToTop = document.createElement("div");
        scrollToTop.id = 'scrollToTop';
        scrollToTop.innerHTML = '<div style="z-index: 999;position: fixed;right: 50px;bottom: 50px;border-radius: 10px; background: #dcdcdc8a;cursor: pointer;padding: 0 10px;font-size: 30px">🔝</div>';
        scrollToTop.onclick = scrollToTopF;
        GM_addStyle('#scrollToTop{visibility: hidden');
        var isComFloat = false;
        var hideCom = document.createElement('div');
        hideCom.id = 'hideCom';
        hideCom.innerHTML = '<';
        hideCom.onclick = function(){
            if(isComFloat){
                GM_addStyle("#pcCommentBox{position:relative; width:0; height:100%; border-color: unset;border:0;} #resizeCom{display:none !important}");
                isComFloat = false;
                showComment();
                return;
            }
            GM_addStyle("#pcCommentBox, #commentSideBoxshadow>.comment-side-content{display: none !important;} .blog-content-box{width:100%} #showCom{display:block !important}");
        }
        var showCom = document.createElement('div');
        showCom.id = 'showCom';
        showCom.innerHTML = '>';
        showCom.onclick = function(){
            let commentBox = document.querySelector('#pcCommentBox, #commentSideBoxshadow>.comment-side-content');
            commentBox.style.width = '29%';
            commentBox.style.height = '100%';
            GM_addStyle("#pcCommentBox, #commentSideBoxshadow>.comment-side-content{display: block !important;} .blog-content-box{width:70%} #showCom{display:none !important}");
        }
        var moveCom = document.createElement('div');
        moveCom.id = 'moveCom';
        moveCom.title = '移动';
        var x = 0;
        var y = 0;
        var l = 0;
        var t = 0;
        var w = 0;
        var h = 0;
        var resizeCom = document.createElement('div');
        resizeCom.id = 'resizeCom';
        resizeCom.title = '调节';
        var isMoving = false, isResizing = false;
        moveCom.onmousedown = function(e){
            let commentBox = document.querySelector('#pcCommentBox');
            if(!isComFloat){
                commentBox.style.width = '60%';
                commentBox.style.height = '50%';
            }
            GM_addStyle("#pcCommentBox{position:fixed;float:left;z-index:10;border:4px solid;border-color: rgb(235,67,82) rgb(243,164,85) rgb(243,164,85) rgb(235,67,82);} .blog-content-box{width:100%} #resizeCom{display:block !important}");
            //获取x坐标和y坐标
            x = e.clientX;
            y = e.clientY;

            //获取左部和顶部的偏移量
            l = commentBox.offsetLeft;
            t = commentBox.offsetTop;
            //开关打开
            isMoving = true;
            isComFloat = true;
            e.preventDefault();
        }
        resizeCom.onmousedown = function(e){
            let commentBox = document.querySelector('#pcCommentBox');
            //获取x坐标和y坐标
            x = e.clientX;
            y = e.clientY;

            //获取左部和顶部的偏移量
            w = commentBox.offsetWidth;
            h = commentBox.offsetHeight;
            //开关打开
            isResizing = true;
            e.preventDefault();
        }
        window.onmousemove = function(e) {
            if (isMoving) {
                let commentBox = document.querySelector('#pcCommentBox');
                //获取x和y
                let nx = e.clientX;
                let ny = e.clientY;
                //计算移动后的左偏移量和顶部的偏移量
                let nl = nx - (x - l);
                let nt = ny - (y - t);
                var sw = document.documentElement.offsetWidth || document.body.offsetWidth ;
                var sh = document.documentElement.offsetHeight || document.body.offsetHeight ;
                if(commentBox.offsetWidth + nl < 100 ) nl = 100 - commentBox.offsetWidth;
                if(nt < 0 ) nt = 0;
                if(nl+commentBox.offsetWidth > sw) nl = sw - commentBox.offsetWidth;
                if(sh - nt < 100 ) nt = sh - 100;

                commentBox.style.left = nl + 'px';
                commentBox.style.top = nt + 'px';
            }
            if (isResizing) {
                let commentBox = document.querySelector('#pcCommentBox');
                //获取x和y
                let nx = e.clientX;
                let ny = e.clientY;
                //计算移动后的左偏移量和顶部的偏移量
                let nw = w + (nx - x);
                let nh = h + (ny - y);

                commentBox.style.width = nw + 'px';
                commentBox.style.height = nh + 'px';
            }
        }
        //鼠标抬起事件
        window.onmouseup = function() {
            if(isMoving){
                isMoving = false;
                let commentBox = document.querySelector('#pcCommentBox');
                commentBox.style.cursor = 'default';
            }
            if(isResizing){
                isResizing = false;
                let commentBox = document.querySelector('#pcCommentBox');
                commentBox.style.cursor = 'default';
            }
        }
        let darkToolbarCss = document.querySelector('link[href*="csdn-toolbar-dark"]');
        if(darkToolbarCss){
            darkToolbarCss.href = darkToolbarCss.href.replace('dark', 'default')
        }
        let darkSkinCss = document.querySelector('link[href*="skin-blackaction"]');
        if(darkSkinCss){
            darkSkinCss.href = ""
        }
        let darkLogo = document.querySelector('img[title="CSDN首页"]');
        if(darkLogo){
            darkLogo.src="https://img-home.csdnimg.cn/images/20201124032511.png"
        }
        window.onload = function(){
            'use strict';
            document.getElementsByTagName('body')[0].appendChild(scrollToTop);
            document.querySelector('.blog-content-box').onscroll = function(){
                let scrollTop = this.scrollTop || document.body.scrollTop;
                // console.log("st:"+scrollTop+";ch:"+clientHeight+";sh:"+scrollHeight)
                if(scrollTop <= 200) {
                    GM_addStyle('#scrollToTop{visibility: hidden');
                }
                if(scrollTop > 200) {
                    GM_addStyle('#scrollToTop{visibility: visible');
                }
            }
            let darkToolbarCss = document.querySelector('link[href*="csdn-toolbar-dark"]');
            if(darkToolbarCss){
                darkToolbarCss.href = darkToolbarCss.href.replace('dark', 'default')
            }
            let darkSkinCss = document.querySelector('link[href*="skin-blackaction"]');
            if(darkSkinCss){
                darkSkinCss.href = ""
            }
            let darkLogo = document.querySelector('img[title="CSDN首页"]');
            if(darkLogo){
                darkLogo.src="https://img-home.csdnimg.cn/images/20201124032511.png"
            }
            //document.querySelector('#pcCommentBox').innerHTML = `<div class="unlogin-comment-model"><span>评论加载中...</span></div>`;
            let bodyLayout = document.querySelector('body');
            bodyLayout.style.setProperty('background-image', 'none', 'important');
            bodyLayout.style.setProperty('background-color', '#f5f6f7', 'important');
            let blogBox = document.querySelector('.blog-content-box');
            blogBox.appendChild(showCom);
            let commentBox = document.querySelector('#commentSideBoxshadow>.comment-side-content');
            commentBox.appendChild(hideCom);
            // commentBox.appendChild(moveCom);
            // commentBox.appendChild(resizeCom);
            if(getCookie('UserName') == null){
                $.ajax({
                    url: 'https://blog.csdn.net/phoenix/web/v1/comment/list/'+articleId+'?page=0&size=3000',
                    type: "POST",
                    success: function (data) {
                        // console.log(data);
                        let commentCustom = document.querySelector('#commentSideBoxshadow>.comment-side-content').outerHTML + `<div class="comment-list-container"><div class="comment-list-box">`;
                        $.each(data.data.list, function(i, r){
                            commentCustom = `${commentCustom}<ul class="comment-list">` +
                                `<li class="comment-line-box">` +
                                `<div class="comment-list-item">` +
                                `<a class="comment-list-href" target="_blank" href="https://blog.csdn.net/${r.info.userName}">` +
                                `<img src="${r.info.avatar}" username="${r.info.userName}" alt="${r.info.userName}" class="avatar">` +
                                `</a>` +
                                `<div class="right-box">` +
                                `<div class="new-info-box clearfix">` +
                                `<div class="comment-top">` +
                                `<div class="user-box">` +
                                `<a class="name-href" target="_blank" href="https://blog.csdn.net/${r.info.userName}">` +
                                `<span class="name ">${r.info.nickName}</span>` +
                                `</a>` +
                                `<span class="date" title="${r.info.postTime}">${r.info.dateFormat}</span>` +
                                `</div>` +
                                `</div>` +
                                `<div class="comment-center">` +
                                `<div class="new-comment">${r.info.content}</div>` +
                                `</div>` +
                                `</div>` +
                                `</div>` +
                                `</div>` +
                                `</li>` +
                                `<li class="replay-box" style="display:block"><ul class="comment-list">`;
                            $.each(r.sub, function(i1, r1){
                                commentCustom = `${commentCustom}<li class="comment-line-box">` +
                                    `<div class="comment-list-item">` +
                                    `<a class="comment-list-href" target="_blank" href="https://blog.csdn.net/${r1.userName}">` +
                                    `<img src="${r1.avatar}" username="${r1.userName}" alt="${r1.userName}" class="avatar">` +
                                    `</a>` +
                                    `<div class="right-box">` +
                                    `<div class="new-info-box clearfix">` +
                                    `<div class="comment-top">` +
                                    `<div class="user-box">` +
                                    `<a class="name-href" target="_blank" href="https://blog.csdn.net/${r1.userName}">` +
                                    `<span class="name ">${r1.nickName}</span>` +
                                    `</a>` +
                                    `<span class="date" title="${r1.postTime}">${r1.dateFormat}</span>` +
                                    `</div>` +
                                    `</div>` +
                                    `<div class="comment-center">` +
                                    `<div class="new-comment">${r1.content}</div>` +
                                    `</div>` +
                                    `</div>` +
                                    `</div>` +
                                    `</div>` +
                                    `</li>`;
                            });
                            commentCustom = `${commentCustom}</ul></li></ul>`;
                        });
                        commentCustom = `${commentCustom}</div></div>`;
                        document.querySelector('#pcCommentSideBox').innerHTML = commentCustom; //`<div class="unlogin-comment-model">` + commentCustom + `</div>`;
                        document.querySelector('#pcCommentSideBox').style.display = 'block';
                        let commentBox = document.querySelector('#commentSideBoxshadow>.comment-side-content');
                        commentBox.appendChild(hideCom);
                        // commentBox.appendChild(moveCom);
                        // commentBox.appendChild(resizeCom);
                        //document.querySelector('.has-comment').innerHTML = null;
                        //document.querySelector('.has-comment').innerHTML = commentCustom;
                    }
                });
            }
            // modify directory jump
            let directory = document.querySelectorAll('#content_views a[target=_self]');
            $.each(directory,function(i, r){
                r.onclick = function() {
                    if(!!document.querySelector('[name="'+$(r).attr('href').replace('#', '')+'"]')) {
                        document.querySelector('[name="'+$(r).attr('href').replace('#', '')+'"]').scrollIntoView()
                    }
                    if(!!document.querySelector('[id="'+$(r).attr('href').replace('#', '')+'"]')) {
                        document.querySelector('[id="'+$(r).attr('href').replace('#', '')+'"]').scrollIntoView()
                    }
                }
                // console.log($(r).attr('href'))
            })

            // monitor copy
            document.addEventListener('copy',function(e){
                let clipboardData = e.clipboardData || window.clipboardData;
                if(!clipboardData) return ;
                clipboardData.setData('text/plain', window.getSelection().toString())
            })
        }
    }
)();