1

私はクロム拡張機能を作っています。拡張機能の実行中に、javascript を使用して、ポップアップ ページからいくつかのコンテンツ スクリプト ファイルを追加または削除したいと考えています。

私の拡張機能では、ユーザーはポップアップ ページから色を選択します。5色あります。だから私は5つのjavascriptファイルを持っています - 各色に1つずつ。

では、ポップアップ ページのどの JavaScript コードが、実行中のコンテンツ スクリプトの JavaScript ファイルを変更するのでしょうか?

4

1 に答える 1

3

まず、5 つの色のそれぞれに 1 つずつ、5 つの JS ファイルがある場合、これは「クローンと変更のプログラミング」のようなものです。これは悪い習慣です。

賢明なことは、パラメーターとして色をオフにする「DRY」コードを含む1 つのJS ファイルを用意することです。「自分自身を繰り返さないでください」を参照してください(原文のまま)。


拡張機能のバックグラウンドからコンテンツ スクリプト全体を読み込むには、「プログラムによるインジェクション」を参照してください。



JavaScriptファイルを動的に追加または削除する場合...

  1. ファイルがロードされると、ファイルを削除することはできません。それが<script>ノードにあり、それを削除しても、解析された関数、変数、タイマー、イベントリスナーなどは引き続きメモリ内でアクティブになります。

    1. 名前付きオブジェクトを上書きできます。たとえば、File'1.jsがグローバルに を設定する場合、後でFile'2.jsx=7;をロードして を設定できます。x=11;
    2. 名前付きタイマーはキャンセルできますが、それぞれを明示的にコーディングする必要があります。
    3. 既知のイベント リスナーをキャンセルすることはできますが、これも慎重にコーディングする必要があります。
    4. 匿名オブジェクト ( ) をオーバーライドすることはできません(function () {... ...} )()
    5. 匿名タイマーはキャンセルできません


    ほとんどの場合、これは価値がある以上に面倒なことです。必要のない場所にコードを設計することをお勧めします。

  2. JS (または他の種類のファイル) を動的に追加できます。以下を参照してください。


JS ファイルを動的に追加するには...

  1. ファイルがmanifest.jsonweb_accessible_resourcesファイルのセクションにリストされていることを確認してください。例えば:

    {
        "manifest_version": 2,
        "content_scripts": [ {
            "exclude_globs":    [  ],
            "include_globs":    [  ],
            "js":               [ "MyContentScript.js" ],
            "matches":          [ "http://YOUR_SERVER.COM/YOUR_PATH/*" ]
        } ],
        "name":         "Dynamically load JS, demo",
        "version":      "1",
        "web_accessible_resources": [
            "MyJavascript_1.js",
            "MyJavascript_2.js",
            "MyJavascript_3.js"
        ]
    }
    


  2. 次に、コンテンツ スクリプト ( MyContentScript.jschrome.extension.getURL ) で、次のようにを使用できます。

    var D           = document;
    var scriptNode  = D.createElement ('script');
    scriptNode.type = "text/javascript";
    scriptNode.src  = chrome.extension.getURL ("MyJavascript_2.js");
    
    var targ = D.getElementsByTagName('head')[0] || D.body || D.documentElement;
    targ.appendChild (scriptNode);
    
于 2012-08-30T07:33:49.267 に答える