如何通过Tampermonkey为Chrome默认PDF阅读器注入filter:invert(1)样式

可用的Tampermonkey脚本 #

直接替换原脚本为以下内容即可生效：

// ==UserScript==
// @name         Dark Mode for Chrome PDF Viewer
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  给Chrome默认PDF阅读器开启深色模式（反转颜色）
// @author       You
// @match        chrome-extension://mhjfbmdgcfjbbpaeojofohoefgiehjai/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 监听页面元素变化，等待PDF的embed加载完成
    const observer = new MutationObserver((mutations) => {
        const pdfEmbed = document.querySelector('embed[type="application/pdf"]');
        if (pdfEmbed) {
            // 创建样式标签注入页面
            const darkStyle = document.createElement('style');
            darkStyle.textContent = `
                embed[type="application/pdf"] {
                    filter: invert(1) hue-rotate(180deg) !important;
                    /* 加hue-rotate是为了修正纯反转后的颜色偏移，让深色模式更自然 */
                }
            `;
            document.head.appendChild(darkStyle);
            observer.disconnect(); // 找到目标元素后停止监听
        }
    });

    // 监听body下所有子元素的变化
    observer.observe(document.body, { childList: true, subtree: true });
})();

原脚本失效的原因 #

• 元素加载时机不对：原脚本在页面初始化后立刻执行，但PDF的embed是动态加载的，此时元素还不存在，样式无法绑定。
• 样式优先级不够：Chrome阅读器自身的样式优先级更高，加上!important才能强制覆盖。
• 匹配范围太局限：原@match只指定了index.html，改成*能覆盖阅读器的所有页面路径。
• 权限限制：放弃GM_addStyle，直接创建style标签注入，避免Tampermonkey的权限限制导致样式不生效。

额外调整建议 #

如果觉得颜色反转太极端，可以修改filter参数：

• 降低反转程度：invert(0.9)
• 微调亮度：filter: invert(1) hue-rotate(180deg) brightness(0.9) !important;

内容的提问来源于stack exchange，提问作者Chetan Sharma0402