Chrome拡張機能：注入後にコンテンツスクリプトCSSを削除するにはどうすればよいですか？

Question

私は拡張子でやりたいためにいくつかの説明

"content_scripts": [{ 
    "matches": ["*://*.youtube.com/*"], 
    "css": ["styles.css"], 
    "js": ["jquery-3.1.1.min.js", "content.js"] 
}], 

content_scripts（manifest.jsonを）から注入されたCSSファイルstyles.cssを削除する必要があります。

最初にstyles.cssが読み込まれ、ページのコードが変更されます。できます。

次に、ユーザーはボタンをクリックして内線をオフにします。できます。

ただし、styles.cssは削除する必要があります。それは動作しません。

ユーザーが延長を有効にしたい場合は、styles.cssをもう一度追加する必要があります。

var style = document.createElement('link'); 
style.rel = 'stylesheet'; 
style.type = 'text/css'; 
style.href = chrome.extension.getURL('myStyles.css'); 
(document.head||document.documentElement).appendChild(style); 

拡張子を始めるされたときに、そのページが数ミリ秒間点滅しますので、それは、うまく動作しませんでした：私はこのようにそれを解決しようとした

。

Answer 1

私はこの問題の解決法を見出しました。

manifest.jsonを

manifest.json 

    "content_scripts": [{ 
    "matches": ["*://*.youtube.com/*"], 
    "js": ["jquery-3.1.1.min.js", "content.js"], 
    "run_at" : "document_start" // It runs content.js first until page loads 
    }], 

    "web_accessible_resources": ["styles.css"] // It provides styles.css for use in content.js 

とcontent.jsのみHTMLでfile.css（提供されたStyles.cssを）をロード

function loadCSS(file) { 
    var link = document.createElement("link"); 
    link.href = chrome.extension.getURL('css/' + file + '.css'); 
    link.id = file; 
    link.type = "text/css"; 
    link.rel = "stylesheet"; 
    document.getElementsByTagName("html")[0].appendChild(link); 
} 

function unloadCSS(file) { 
    var cssNode = document.getElementById(file); 
    cssNode && cssNode.parentNode.removeChild(cssNode); 
} 

content.jsページが読み込まれるまでタグを付けてください