EasyCSDN

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

当前为 2023-12-09 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name EasyCSDN
  3. // @description 这是一款促进CSDN极致简洁和高效的插件。免费共享大量创新功能,如:净化页面、展示全屏、显示推荐、复制文本、展开代码等。让我们的学习体验无比简洁、专注、高效、畅快。
  4. // @version 26.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. .hljs-button.signin /*隐藏[正文的][代码块的]复制提示*/,
  39. .code-annotation /*隐藏[正文的][代码块的]一键注释*/,
  40. .article-search-tip /*隐藏[正文的]搜索提示*/
  41. {
  42. display: none !important;
  43. }
  44.  
  45. /*隐藏背景*/
  46. body {
  47. background: none !important;
  48. background-image: unset !important;
  49. background-color: unset !important;
  50. }
  51.  
  52. /*调整标题*/
  53. #articleContentId {
  54. display: flex;
  55. justify-content: center;
  56. font-size: 33px;
  57. padding-top:23px;
  58. padding-bottom: 10px;
  59. }
  60.  
  61. /*调整头像*/
  62. .article-type-img {
  63. display: none !important;
  64. border-radius: 4px !important;
  65. height: 28px !important;
  66. width: 28px !important;
  67. margin: 6px !important;
  68. }
  69.  
  70. /*正文的div居中*/
  71. #mainBox {
  72. display: flex;
  73. justify-content: center;
  74. }
  75.  
  76. /*展示全屏*/
  77. #mainBox {
  78. width: 100%;
  79. }
  80. #mainBox main {
  81. width: 82%;
  82. margin-bottom: unset !important;
  83. }
  84. .main_father {
  85. padding: unset !important;
  86. }
  87. .main_father.d-flex {
  88. display: unset !important;
  89. }
  90.  
  91. /*临时显示*/
  92. .show-temp {
  93. display: unset !important;
  94. }
  95.  
  96. /*适当展示图片*/
  97. img {
  98. max-width: 70% !important;
  99. }
  100.  
  101. /*阅读全文*/
  102. .hide-article-box {
  103. display: none !important;
  104. }
  105. #article_content {
  106. height: auto !important;
  107. overflow: auto !important;
  108. }
  109. `;
  110.  
  111.  
  112. /*移动端净化样式*/
  113. const purify_style_mb = `
  114. #csdn-toolbar /*隐藏[置顶的][顶部的]菜单栏*/,
  115. #operate /*隐藏[置顶的][底部的]搜索标签与评论*/,
  116. .aside-header-fixed /*隐藏[顶部的]关注*/
  117. {
  118. display: none !important;
  119. }
  120.  
  121. /*展示全屏*/
  122. body #main {
  123. padding-top: unset !important;
  124. margin-top: unset !important;
  125. }
  126. body {
  127. padding-bottom: unset !important;
  128. }
  129.  
  130. /*展示分界线*/
  131. .spec_space {
  132. background-color: #ffebeb !important;
  133. height: 32px !important;
  134. }
  135. `;
  136.  
  137. //净化页面
  138. const purifyPage = function() {
  139. GM_addStyle(purify_style_pc);
  140. GM_addStyle(purify_style_mb);
  141. };
  142.  
  143. //显示推荐的开关
  144. const showRecommend = function() {
  145. const sr = document.createElement("div");
  146. sr.style = "height: 64px; background-color: #eaeaea;";
  147. sr.onclick = function() {
  148. $$(".recommend-box").forEach(el => {
  149. el.classList.toggle("show-temp");
  150. });
  151. $(".recommend-box")?.scrollIntoView();
  152. };
  153. $('main').insertBefore(sr, $('.recommend-box'));
  154. };
  155.  
  156. //展开代码
  157. const prettyCode = function() {
  158. const browser_menu_height = window.outerHeight - window.innerHeight; //浏览器顶部菜单栏高度
  159. const browser_height_max = screen.height - browser_menu_height; //浏览器最大可展示高度
  160. let i = 0;
  161. $$('.set-code-hide').forEach(el => {
  162. if (i == 0 && $("code", el)?.clientHeight <= browser_height_max * 1.8) {
  163. //预判首个代码块实际高度,若小于浏览器最大可展示高度的180%,则自动展开代码
  164. $(".hide-preCode-bt", el)?.click();
  165. } else if ($("code", el)?.clientHeight <= browser_height_max * 0.8) {
  166. //预判其余代码块实际高度,若小于浏览器最大可展示高度的80%,则自动展开代码
  167. $(".hide-preCode-bt", el)?.click();
  168. }
  169. i++;
  170. });
  171. };
  172.  
  173. //拦截推荐搜索
  174. const hookXHR = function() {
  175. const origOpen = XMLHttpRequest.prototype.open;
  176. const block_url = 'redisdatarecall\.csdn\.net/recommend/';
  177. XMLHttpRequest.prototype.open = function() {
  178. const reqUrl = arguments[1];
  179. if (reqUrl.match(block_url)){
  180. return;
  181. }
  182. origOpen.apply(this, arguments);
  183. };
  184. };
  185.  
  186. //调整头像
  187. const beautyLOGO = function() {
  188. $('.article-type-img').src = $('link[rel="shortcut icon"]').href;
  189. $('.article-type-img').style = 'display: block !important;';
  190. };
  191.  
  192. window.onload = function() {
  193. beautyLOGO();
  194. prettyCode();
  195. showRecommend();
  196. };
  197.  
  198. purifyPage();
  199. hookXHR();
  200.  
  201. })();