Javascript-форум - Скрипт GreaseMonkey для замены CSS

Javascript-форум (https://javascript.ru/forum/)

- Firefox/Mozilla (https://javascript.ru/forum/css-html-firefox-mizilla/)

- - Скрипт GreaseMonkey для замены CSS (https://javascript.ru/forum/css-html-firefox-mizilla/50368-skript-greasemonkey-dlya-zameny-css.html)

Скрипт GreaseMonkey для замены CSS

Доброго времени суток господа. Подскажите пожалуйста, как мне при помощи GreaseMonkey запретить загружать стиль с сервера и подключить стили с другого ресурса?

или даже просто запретить, подключить я смогу через stylish

Не грузить увы не получится. Можно просто удалить старые и подключить новые. Или даже просто подключить новые, что перекрывают старые.

Array.forEach(document.querySelectorAll('style, link[rel="stylesheet"]'), e => e.remove());
document.head.insertAdjacentHTML('beforeend', '<link rel="stylesheet" type="text/css" href="//site.ru/style.css"" />');

Спасибо, буду пробовать!

Что бы не плодить новую тему, решил спросить тут..
Вставляю свой стиль на сайт для своего блока через GM.
Собственно код:

var runId = setTimeout(runFN, 1000);

function runFN(){
    console.log("Запустили скрипт!");
    myCSS();
    HTML();   
}

function myCSS(){
    console.log("Создали CSS");
    var css = ".myClass { width: auto; height: auto; background-color: rgba(184, 178, 169, 0.65); right: 230px; top: 100px; z-index: 3000; position: absolute; border: 1px solid rgba(232, 229, 225, 0.9); margin: 10px; max-width: 400px; padding: 2px;}"; 
        css += ".myClassContent { background-color: rgba(255, 255, 255, 0.85); margin: 10px; border: 1px solid #7b746e; padding: 8px 10px; word-wrap: break-word; }";   
    var nodeCSS = document.createElement("style");
	    nodeCSS.type = "text/css";
        nodeCSS.innerHTML = css;
	var heads = document.getElementsByTagName("head");
		heads[0].appendChild(nodeCSS); 
}

function HTML(){
  console.log("Создали HTML");  
  var parent = document.getElementsByTagName('BODY')[0];
  var myNode = document.createElement('DIV');  
      myNode.className = 'myClass';
      myNode.id = 'myEl';
      myNode.innerHTML = '<span class="myClassContent">Тестовый контент</span>';
      parent.appendChild(myNode);
}

По идее нижний слой (див) должен создать "рамку" вокруг слоя с текстом (спан).
По факту выходит так
https://codepen.io/Andy84/pen/dXRaOd?editors=1111
Не могу понять где не прав.
Подскажите пжл.

Benos,
строка 25 display: inline-block;

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">


</head>

<body>

<script>
 var runId = setTimeout(runFN, 1000);

function runFN(){
    console.log("Запустили скрипт!");
    myCSS();
    HTML();
}

function myCSS(){
    console.log("Создали CSS");
    var css = ".myClass { width: auto; height: auto; background-color: rgba(184, 178, 169, 0.65); right: 230px; top: 100px; z-index: 3000; position: absolute; border: 1px solid rgba(232, 229, 225, 0.9); margin: 10px; max-width: 400px; padding: 2px;}";
        css += ".myClassContent {display: inline-block; background-color: rgba(255, 255, 255, 0.85); margin: 10px; border: 1px solid #7b746e; padding: 8px 10px; word-wrap: break-word; }";
    var nodeCSS = document.createElement("style");
      nodeCSS.type = "text/css";
        nodeCSS.innerHTML = css;
  var heads = document.getElementsByTagName("head");
    heads[0].appendChild(nodeCSS);
}

function HTML(){
  console.log("Создали HTML");
  var parent = document.getElementsByTagName('BODY')[0];
  var myNode = document.createElement('DIV');
      myNode.className = 'myClass';
      myNode.id = 'myEl';
      myNode.innerHTML = '<span class="myClassContent">Тестовый контент</span>';
      parent.appendChild(myNode);
}

</script>
</body>
</html>

Benos,
или <p> строка 39

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">


</head>

<body>

<script>
 var runId = setTimeout(runFN, 1000);

function runFN(){
    console.log("Запустили скрипт!");
    myCSS();
    HTML();
}

function myCSS(){
    console.log("Создали CSS");
    var css = ".myClass { width: auto; height: auto; background-color: rgba(184, 178, 169, 0.65); right: 230px; top: 100px; z-index: 3000; position: absolute; border: 1px solid rgba(232, 229, 225, 0.9); margin: 10px; max-width: 400px; padding: 2px;}";
        css += ".myClassContent {background-color: rgba(255, 255, 255, 0.85); margin: 10px; border: 1px solid #7b746e; padding: 8px 10px; word-wrap: break-word; }";
    var nodeCSS = document.createElement("style");
      nodeCSS.type = "text/css";
        nodeCSS.innerHTML = css;
  var heads = document.getElementsByTagName("head");
    heads[0].appendChild(nodeCSS);
}

function HTML(){
  console.log("Создали HTML");
  var parent = document.getElementsByTagName('BODY')[0];
  var myNode = document.createElement('DIV');
      myNode.className = 'myClass';
      myNode.id = 'myEl';
      myNode.innerHTML = '<p class="myClassContent">Тестовый контент</p>';
      parent.appendChild(myNode);
}

</script>
</body>
</html>

рони,
Спасибо!