javascript - 隐藏名称中带有空格的类

Question

我有这个简单的 GreaseMonkey 脚本用于在 GMail 中隐藏内容:

// ==UserScript==
// @name        GMail
// @namespace   Namespace
// @include     https://mail.google.com/*
// @version     1
// @grant       none
// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

addGlobalStyle(".mq, .oM, .AT, .Zs { display: none; }");

它工作正常，但我发现我需要在 GMail 上隐藏一个元素，它显示为:

<div class="P4mo8e gsl0xd hh">

我不确定如何隐藏它们，因为我已经尝试过:

addGlobalStyle(".mq, .oM, .AT, .Zs, .P4mo8e, .gsl0xd, .hh { display: none; }");

但这没有用，因为该 div 中的内容仍然出现。

如有任何建议，我们将不胜感激。

谢谢

Answer 1

那些是多个类，而不是一个有空格的类。这意味着您的样式定义不是 specific足以覆盖 Gmail 设置的样式。尝试类似的东西:

addGlobalStyle(".P4mo8e.gsl0xd.hh { display: none !important; }")

尽管如此，如果元素具有带 !important 标志的内联样式，则仍然不能保证有效。