1

对于我的 Chrome 扩展程序，我需要任何有效的 Gmail 邮件 URL 的匹配模式。例子：

https://mail.google.com/mail/u/0/?shva=1#inbox/140acd877b64109b

我尝试的manifest.json是以下内容：

"content_scripts": [ {
        "matches":      ["*://*.mail.google.com/mail/u/0/?shva=1#inbox/*"],
        "css":          ["default.css"]
    } ]

但是，当我使用上述 URL 模式访问 Gmail 邮件时，我的自定义样式表不会应用。

任何想法为什么不应用它？

如果我只使用"matches": ["*://*.mail.google.com"]，那么它可以工作。但是我不希望样式表也应用于我的收件箱页面。因此，我正在寻找一种仅捕获单个消息页面的模式。

4

1 回答 1

3

位置片段 ( #...)在匹配模式中始终被忽略。上次我检查时，该字段的查询字符串也被忽略了"css"。

要获得所需的效果，只需在 上插入样式表"*://*.mail.google.com/*"，并使用内容脚本来检测 URL 更改。例如：

的片段manifest.json：

"content_scripts": [ {
    "matches":      ["*://*.mail.google.com/*"],
    "css":          ["default.css"],
    "js":           ["style-toggler.js"]
} ]

示例default.css： 

.turn-on-my-style img {
    visibility: hidden;
}

如果为 CSS 选择器添加前缀需要花费太多精力，我建议使用 CSS 预处理器，例如LESS。

style-toggler.js：

function hashCheck() {
    if (/^#inbox\/.*/.test(location.hash)) {
        document.documentElement.classList.add('turn-on-my-style');
    } else {
        document.documentElement.classList.remove('turn-on-my-style');
    }
}
window.addEventListener('hashchange', hashCheck);
hashCheck();
于 2013-08-24T15:58:34.230 回答