让CSDN文章浏览更轻松：利用油猴脚本的力量（上）

2023-10-23 10:40:39

在计算机的世界里，CSDN就像是一片绿洲，为程序员们提供了取之不尽、用之不竭的知识宝藏。然而，在这片绿洲中穿梭时，有时难免会遇到一些小障碍，比如有些文章需要登录才能查看完整内容，有些代码块无法直接复制，还有很多广告分散了我们的注意力。

这些小障碍虽然不会完全阻挡我们前进的脚步，却会在一定程度上影响我们的阅读体验和学习效率。为了扫清这些障碍，让CSDN文章的浏览更加轻松，我们可以借助油猴脚本的力量。

油猴脚本是一款功能强大的浏览器扩展程序，它可以帮助我们自定义浏览器的行为，实现各种各样的功能。通过油猴脚本，我们可以轻松地去除CSDN文章中的广告、自动登录CSDN账号、一键复制代码块，甚至可以将CSDN文章导出为PDF格式。

今天，我们就来学习如何使用油猴脚本来优化CSDN文章的浏览体验。本系列教程共分为两部分，上半部分将介绍如何去除CSDN文章中的广告、自动登录CSDN账号和一键复制代码块，下半部分将介绍如何将CSDN文章导出为PDF格式。

去除CSDN文章中的广告

在CSDN文章中，经常会有一些广告穿插其中，这些广告不仅影响了我们的阅读体验，还会分散我们的注意力。为了去除CSDN文章中的广告，我们可以使用以下油猴脚本：

// ==UserScript==
// @name         去除CSDN文章中的广告
// @namespace    https://greasyfork.org/users/707367
// @version      1.0
// @description  去除CSDN文章中的广告
// @author       搬运工
// @match        https://blog.csdn.net/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 隐藏CSDN文章中的广告
    var ads = document.querySelectorAll('.toutiao-mod, .qrcode-box, .csdn-side-toolbar, .article-advertising');
    for (var i = 0; i < ads.length; i++) {
        ads[i].style.display = 'none';
    }
})();

将上述脚本粘贴到油猴脚本的新建脚本中，并保存。然后，刷新CSDN文章页面，即可看到广告已经消失了。

自动登录CSDN账号

在CSDN上，有些文章需要登录才能查看完整内容。为了避免每次阅读文章时都需要登录，我们可以使用以下油猴脚本来实现自动登录：

// ==UserScript==
// @name         自动登录CSDN账号
// @namespace    https://greasyfork.org/users/707367
// @version      1.0
// @description  自动登录CSDN账号
// @author       搬运工
// @match        https://blog.csdn.net/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 获取CSDN账号和密码
    var username = 'your_username';
    var password = 'your_password';

    // 自动登录CSDN账号
    var loginForm = document.querySelector('#passport-login-form');
    if (loginForm) {
        loginForm.querySelector('input[name="username"]').value = username;
        loginForm.querySelector('input[name="password"]').value = password;
        loginForm.submit();
    }
})();

将上述脚本粘贴到油猴脚本的新建脚本中，并保存。然后，刷新CSDN文章页面，即可看到已经自动登录了。

一键复制代码块

在CSDN文章中，经常会有一些代码块，我们需要复制这些代码块进行学习或使用。为了方便复制代码块，我们可以使用以下油猴脚本：

// ==UserScript==
// @name         一键复制代码块
// @namespace    https://greasyfork.org/users/707367
// @version      1.0
// @description  一键复制代码块
// @author       搬运工
// @match        https://blog.csdn.net/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 添加复制按钮
    var codeBlocks = document.querySelectorAll('pre code');
    for (var i = 0; i < codeBlocks.length; i++) {
        var codeBlock = codeBlocks[i];
        var copyButton = document.createElement('button');
        copyButton.innerHTML = '复制';
        copyButton.style.marginLeft = '5px';
        copyButton.style.cursor = 'pointer';
        copyButton.addEventListener('click', function() {
            navigator.clipboard.writeText(codeBlock.textContent);
            alert('代码已复制到剪贴板');
        });
        codeBlock.parentNode.insertBefore(copyButton, codeBlock);
    }
})();