☰

Greasy Fork is available in English.

EasyCSDN

这是一款促进CSDN极致简洁和高效的插件。免费共享大量创新功能，如：净化页面、展示全屏、显示推荐、复制文本、展开代码等。让我们的学习体验无比简洁、专注、高效、畅快。

  1. // ==UserScript==
  2. // @name         EasyCSDN
  3. // @description  这是一款促进CSDN极致简洁和高效的插件。免费共享大量创新功能，如：净化页面、展示全屏、显示推荐、复制文本、展开代码等。让我们的学习体验无比简洁、专注、高效、畅快。
  4. // @version      32.0
  5. // @author       xcanwin
  6. // @namespace    https://github.com/xcanwin/EasyCSDN/
  7. // @supportURL   https://github.com/xcanwin/EasyCSDN/
  8. // @license      GPL-2.0-only
  9. // @match        *://blog.csdn.net/*/article/details/*
  10. // @match        *://*.blog.csdn.net/article/details/*
  11. // @grant        GM_addStyle
  12. // @run-at       document-start
  13. // ==/UserScript==
  14.  
  15. (function() {
  16.     'use strict';
  17.  
  18.     const $ = (Selector, el) => (el || document).querySelector(Selector);
  19.     const $$ = (Selector, el) => (el || document).querySelectorAll(Selector);
  20.  
  21.     /*电脑端净化样式*/
  22.     const purify_style_pc = `
  23. .passport-login-container /*隐藏[置顶的]登录提示*/,
  24. .passport-login-tip-container /*隐藏[置顶的]登录权益提示*/,
  25. body>#toolbarBox /*隐藏[置顶的][顶部的]菜单栏*/,
  26. .left-toolbox /*隐藏[置顶的][底部的]关注栏*/,
  27. .blog_container_aside /*隐藏[左边的]栏*/,
  28. #rightAside /*隐藏[右边的]栏*/,
  29. .csdn-side-toolbar /*隐藏[右边的]磁吸栏*/,
  30. .blog-footer-bottom /*隐藏[底部的]网站介绍*/,
  31. .recommend-nps-box /*隐藏[底部的]打分*/,
  32. .blog-tags-box /*隐藏[正文的][顶部的]分类*/,
  33. .column-group /*隐藏[正文的][顶部的]加入社区*/,
  34. #blogColumnPayAdvert /*隐藏[正文的][顶部的]专栏*/,
  35. .more-toolbox-new /*隐藏[正文的][底部的]关注栏*/,
  36. #treeSkill /*隐藏[正文的][底部的]技能树*/,
  37. .recommend-box /*隐藏[正文的][底部的]推荐文章*/,
  38. .recommend-box div[data-url*="download.csdn.net"] /*隐藏[正文的][底部的]含有下载的推荐文章*/,
  39. .recommend-box div[data-url*="wenku.csdn.net"] /*隐藏[正文的][底部的]含有文库的推荐文章*/,
  40. .hljs-button.signin /*隐藏[正文的][代码块的]复制提示*/,
  41. .code-annotation /*隐藏[正文的][代码块的]一键注释*/,
  42. .article-search-tip /*隐藏[正文的]搜索提示*/
  43. {
  44.     display: none !important;
  45. }
  46.  
  47. /*隐藏背景*/
  48. html body {
  49.     background: none !important;
  50.     background-image: unset !important;
  51.     background-color: unset !important;
  52. }
  53.  
  54. /*调整标题*/
  55. .title-article {
  56.     display: flex !important;
  57.     justify-content: center !important;
  58.     font-size: 33px !important;
  59.     padding-top:23px !important;
  60.     padding-bottom: 10px !important;
  61. }
  62.  
  63. /*调整头像*/
  64. .article-type-img {
  65.     display: none !important;
  66.     border-radius: 4px !important;
  67.     height: 28px !important;
  68.     width: 28px !important;
  69.     margin: 6px !important;
  70.     margin-right: 20px !important;
  71. }
  72.  
  73. /*正文的div居中*/
  74. #mainBox {
  75.     display: flex;
  76.     justify-content: center;
  77. }
  78.  
  79. /*正文的图片居中*/
  80. #content_views p img {
  81.     display: flex;
  82.     margin-left: auto;
  83.     margin-right: auto;
  84. }
  85.  
  86. /*展示全屏*/
  87. #mainBox {
  88.     width: 100%;
  89. }
  90. #mainBox main {
  91.     width: 82%;
  92.     margin-bottom: unset !important;
  93. }
  94. .main_father {
  95.     padding: unset !important;
  96. }
  97. .main_father.d-flex {
  98.     display: unset !important;
  99. }
  100.  
  101. /*临时显示*/
  102. .show-temp {
  103.     display: unset !important;
  104. }
  105.  
  106. /*适当展示图片*/
  107. main #content_views img {
  108.     max-width: 70% !important;
  109. }
  110.  
  111. /*阅读全文*/
  112. .hide-article-box {
  113.     display: none !important;
  114. }
  115. #article_content {
  116.     height: auto !important;
  117.     overflow: auto !important;
  118. }
  119. `;
  120.  
  121.  
  122.     /*移动端净化样式*/
  123.     const purify_style_mb = `
  124. #csdn-toolbar /*隐藏[置顶的][顶部的]菜单栏*/,
  125. #operate /*隐藏[置顶的][底部的]搜索标签与评论*/,
  126. .article-type /*隐藏[正文的][顶部的]文章类型*/,
  127. .have-heart-count /*隐藏[正文的][顶部的]赞*/,
  128. .identity-icon /*隐藏[正文的][顶部的]身份等级*/,
  129. #detailFollow /*隐藏[正文的][顶部的]关注*/,
  130. #recommend /*隐藏[正文的][底部的]推荐文章*/,
  131. #recommend div[data-url*="download.csdn.net"] /*隐藏[正文的][底部的]含有下载的推荐文章*/,
  132. #recommend div[data-url*="wenku.csdn.net"] /*隐藏[正文的][底部的]含有文库的推荐文章*/
  133. {
  134.     display: none !important;
  135. }
  136.  
  137. /*展示全屏*/
  138. body #main {
  139.     padding-top: unset !important;
  140.     margin-top: unset !important;
  141. }
  142. body {
  143.     padding-bottom: unset !important;
  144. }
  145.  
  146. /*展示分界线*/
  147. .spec_space {
  148.     height: 32px !important;
  149.     background-color: #eaeaea !important;
  150. }
  151. `;
  152.  
  153.     //净化页面
  154.     const purifyPage = function() {
  155.         GM_addStyle(purify_style_pc);
  156.         GM_addStyle(purify_style_mb);
  157.     };
  158.  
  159.     //显示推荐的开关
  160.     const showRecommend = function() {
  161.         const sr = document.createElement("div");
  162.         sr.style = "height: 64px; background-color: #eaeaea;";
  163.         sr.onclick = function() {
  164.             $$(".recommend-box").forEach(el => {
  165.                 el.classList.toggle("show-temp");
  166.             });
  167.             $(".recommend-box")?.scrollIntoView();
  168.         };
  169.         $('main').insertBefore(sr, $('.recommend-box'));
  170.     };
  171.  
  172.     //展开代码
  173.     const prettyCode = function() {
  174.         const browser_menu_height = window.outerHeight - window.innerHeight; //浏览器顶部菜单栏高度
  175.         const browser_height_max = screen.height - browser_menu_height; //浏览器最大可展示高度
  176.         let i = 0;
  177.         $$('.set-code-hide').forEach(el => {
  178.             if (i == 0 && $("code", el)?.clientHeight <= browser_height_max * 1.8) {
  179.                 //预判首个代码块实际高度，若小于浏览器最大可展示高度的180%，则自动展开代码
  180.                 $(".hide-preCode-bt", el)?.click();
  181.             } else if ($("code", el)?.clientHeight <= browser_height_max * 0.8) {
  182.                 //预判其余代码块实际高度，若小于浏览器最大可展示高度的80%，则自动展开代码
  183.                 $(".hide-preCode-bt", el)?.click();
  184.             }
  185.             i++;
  186.         });
  187.     };
  188.  
  189.     //拦截推荐搜索
  190.     const hookXHR = function() {
  191.         const origOpen = XMLHttpRequest.prototype.open;
  192.         const block_url = 'redisdatarecall\.csdn\.net/recommend/';
  193.         XMLHttpRequest.prototype.open = function() {
  194.             const reqUrl = arguments[1];
  195.             if (reqUrl.match(block_url)){
  196.                 return;
  197.             }
  198.             origOpen.apply(this, arguments);
  199.         };
  200.     };
  201.  
  202.     //调整头像
  203.     const beautyLOGO = function() {
  204.         $('.article-type-img').src = $('link[rel="shortcut icon"]').href;
  205.         $('.article-type-img').style = 'display: block !important;';
  206.     };
  207.  
  208.     //净化URL, 保障用户信息安全
  209.     const prettyURL = function() {
  210.         let newurl = location.href.match('(https?://.*?blog\.csdn\.net/.*?article/details/.*?)\\?');
  211.         if (newurl) {
  212.             newurl = newurl[1];
  213.             window.history.replaceState({
  214.                 path: newurl
  215.             }, '', newurl);
  216.         }
  217.     };
  218.  
  219.     window.onload = function() {
  220.         beautyLOGO();
  221.         prettyCode();
  222.         showRecommend();
  223.     };
  224.  
  225.     purifyPage();
  226.     prettyURL();
  227.     hookXHR();
  228.  
  229. })();