Greasemonkey를 사용하여 CSS 파일의 줄 바꾸기

Question

.css 파일의 한 줄을 대체하는 Greasemonkey 스크립트를 쓰려고합니다.

all.css에서 원래 라인은

#header { 
    background: transparent url('img/bg-graph-top.png?v=7e4ce14d05fb') no-repeat 50% -25px; 
} 

은 내가 이렇게 내 첫 userscript를 작성하는 노력 https://stackoverflow.com/a/6854437/9072294을 바탕으로

#header { 
    background: transparent url('https://upload.wikimedia.org/wikipedia/commons/0/09/Dummy_flag.png') no-repeat 50% -25px; 
} 

---

로 교체하고 싶습니다이다

// ==UserScript== 
// @name   swap 
// @include   http://tex.stackexchange.com/* 
// @include   https://tex.stackexchange.com/* 
// @require   http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js 
// ==/UserScript== 

var desiredImage = "https://upload.wikimedia.org/wikipedia/commons/0/09/Dummy_flag.png"; 

//--- Straight image swap: 
$('img/bg-graph-top.png?v=7e4ce14d05fb').attr ('src', desiredImage); 

/*--- Replace the link's -- with the logo as a background -- contents with just a plain image. 
    Since this image is transparent, clear the old BG image. 
    Also constrain the new img to its container. 
*/ 
$('#header all').css ('background-', 'none') 
       .append ('<url>').find ('img/bg-graph-top.png?v=7e4ce14d05fb') .attr ('src', desiredImage).css(); 

그러나 이미지가 변경되지 않습니다. (

Answer 1

다른 답변과 마찬가지로 <img> 태그가 아닌 배경 이미지를 변경하려고합니다.

그런 경우 CSS 무시를 사용하십시오.

는 여기에 그리스 몽키/Tampermonkey 스크립트의 모습입니다 :

// ==UserScript== 
// @name  _TeX SE, Swap header background 
// @match  *://tex.stackexchange.com/* 
// @grant  GM_addStyle 
// @run-at  document-start 
// ==/UserScript== 

GM_addStyle (` 
    #header { 
     background: transparent url('https://upload.wikimedia.org/wikipedia/commons/0/09/Dummy_flag.png') no-repeat 50% -25px !important; 
    } 
`); 

참고 !important 플래그.

또한 @run-at document-start은 스크립트가 DOM을 조작하는 경우 복잡하게 만들 수 있습니다.

어쨌든 은 순수한 CSS로 변경되었습니다. 이처럼 the Stylish extension을 사용하는 것이 좋습니다. 소란스럽고 잘 수행됩니다.