Скрыть класс с пробелом в его имени

#javascript #css #greasemonkey

Вопрос:

У меня есть этот простой скрипт 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 все еще отображается.

Любые советы будут высоко оценены.

Спасибо

Ответ №1:

Это несколько классов, а не один класс с пробелами. Это означает, что ваше определение стиля недостаточно конкретно, чтобы переопределить стили, установленные Gmail. Попробуйте что-то вроде:

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

Хотя это все равно не гарантирует, что будет работать, если элемент имеет встроенный стиль с !important флагом an.

1. Я использовал !important пользовательские скрипты в GMail, и это обычно работает. GMail сложно взломать чисто, но я не думаю, что он устанавливает стили для каких-либо элементов напрямую.

Ответ №2:

У классов нет пробелов в имени. Это способ применения более одного класса к элементу HTML. Так P4mo8e gsl0xd hh же как и три класса, которые предположительно применяют разные стили, но они могут существовать, чтобы позволить JavaScript ссылаться на них.