3

JSとCSSをYouTubeページに挿入しようとしています。JSを挿入できますが、CSSを挿入しても効果がありません。私は何か間違ったことをしていますか、それともYouTubeが何らかの方法で私を制限していますか?

これが私のmanifest.jsonの関連部分です:

  "content_scripts": [
    {
      "matches": ["http://www.youtube.com/watch?v*"],
      "css": ["ChromeExtension/css/inject.css"],
      "js": ["ChromeExtension/js/thirdParty/underscore.js", "ChromeExtension/js/thirdParty/jquery.js", "ChromeExtension/js/inject.js"]
    }
  ]

すべてのjsが適切に挿入されているのがわかりますが、cssでは効果がありません。私のCSSはまったく挿入されていないようです:

ここに画像の説明を入力してください

アップデート:

好奇心が強い..このコードの挿入は機能しますが、すべてのcssプロパティに「!important」を適用しようとしました。これらの2つの方法は、StackOverflowで提供される他のソリューションとは対照的に異なる効果をもたらしました。

私はこれでより多くの成功を収めましたが、より簡潔な定義が失敗する理由については引き続き興味があります。

var style = document.createElement('link');
style.rel = 'stylesheet';
style.type = 'text/css';
style.href = chrome.extension.getURL('ChromeExtension/css/inject.css');
document.head.appendChild(style);
4

1 に答える 1

0

を使用する必要はありません!important。cssに高い特異性があることを確認して、すでに存在するものをオーバーライドしてください。bodyのスタイルを見ると、次のようになっているはずです。ここに画像の説明を入力してください

これは、cssが適用されており、オーバーライドされていることを示しています。cssを次のようなものに変更します

body.ltr{
  background-color: #000;
}

うまく動作します。

編集:それに加えて、問題は実際に?は一致パターンにある可能性があります。私にとってはhttp:///www.youtube.com/watch*機能しませんが、機能しhttp:///www.youtube.com/watch?*ません。なぜこれがの注入に影響を与えるのかについてcssは、js私には手がかりがありません。

于 2013-03-27T05:37:42.557 に答える