GM_addStyle Entsprechung in TamperMonkey

Question

Gibt es ein TamperMonkey-Äquivalent zu GreaseMonkey GM_addStyle Methode für das Hinzufügen von CSS?

In Greasemonkey, Sie eine Reihe von CSS-Eigenschaften, um mehrere Elemente wie so hinzufügen:

GM_addStyle("body { color: white; background-color: black; } img { border: 0; }"); 

das Äquivalent in TamperMonkey zu tun, habe ich zur Zeit folgendes zu tun:

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('body { color: white; background-color: black; }'); 

Das funktioniert, aber gibt es eine eingebaute GM_addStyle Entsprechung für TamperMonkey, die mich davon abhält, das auf jedem Skript zu wiederholen?

Answer 1

Gemäß the TamperMonkey documentation unterstützt es direkt GM_addStyle, wie GreaseMonkey. Überprüfen Sie Ihre include/Einstimmungsregeln korrekt sind, dann fügen Sie diese Demo Code am Anfang Ihres userscript:

GM_addStyle('* { font-size: 99px !important; }'); 
console.log('ran'); 

Getestet habe ich es nur auf einem frischen userscript in Chrome 35 und es funktionierte wie erwartet. Wenn Sie eine andere @grant rule haben, müssen Sie eine für diese Funktion hinzufügen, andernfalls sollte sie automatisch erkannt und gewährt werden.

Answer 2

Wenn GM_addStyle(...) nicht funktioniert, überprüfen Sie, ob Sie @grant GM_addStyle Header haben.

So:

// ==UserScript== 
// @name   Example 
// @description See usercript with grant header. 
// @grant   GM_addStyle 
// ==/UserScript== 

GM_addStyle("body { color: white; background-color: black; } img { border: 0; }"); 

Answer 3

Wenn jemand interessiert ist, änderte ich den Code so müssen Sie nach jeder CSS-Regel nicht schreiben „wichtig“. Das funktioniert natürlich nur, wenn Sie die Funktion anstelle von GM_addStyle verwenden.

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.replace(/;/g, ' !important;'); 
    head.appendChild(style); 
} 

Der Ausgang dieses "addGlobalStyle('body { color: white; background-color: black; }');",

wird "body { color: white !important; background-color: black !important; }');"