16

Chrome 拡張機能の魔法の世界に足を踏み入れようとしています。これで、jquery を読み込もうとしてマニフェストを作成しました。

{
    "name": "Test Extension",
    "version": "0.1",
    "manifest_version": 2,
    "description": "First try",
    "options_page": "options.html",
    "content_scripts": [{
        "matches": ["chrome-extension://*/*"],
        "js": ["jquery.js", "popup.js"],
        "run_at": "document_end"
    }],
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html",
        "default_title": "Click me!"
    }
}

実際に拡張機能をリロードしようとすると、「一致」が有効なスキーマと一致しないことがわかります。

しかし、それだけではありません。それを乗り越えるために、「一致」の値を変更し*://*/*てリロードしようとしました。拡張機能は正しく読み込まれているようですが、popup.js から取得できるエラーのために jquery が読み込まれていないようです。

Uncaught ReferenceError: $ が定義されていません

実際、HTML は次のとおりです。

<!doctype html>
<html>
<head>
    <title>Test Extension</title>
    <link rel="stylesheet" style="text/css" src="style.css">
</head>
<body>
    <div id="test"></div>
</body>
</html>
<script type="text/javascript" src="popup.js"></script>

popup.js コードは次のようにします。

$("#test").html("Foo!");
4

2 に答える 2

17

コンテンツ スクリプトは、拡張機能のコンテキストでは決して実行されません。ブラウザ アクション ポップアップにスクリプトをロードする正しい方法は、スクリプトをコードに含めることです。マニフェスト ファイルを次のようにします。

{
    "name": "Test Extension",
    "version": "0.1",
    "manifest_version": 2,
    "options_page": "options.html",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html",
        "default_title": "Click me!"
    }
}

そしてpopup.html：

...
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="popup.js"></script>
于 2012-08-20T09:43:49.243 に答える
0 
$.("#test").html("Foo!");

する必要があります

$("#test").html("Foo!");

発生するエラーは、コードのこの部分が正しくないことと一致しています。

于 2012-08-20T09:37:38.260 に答える