在 Chrome 扩展内容脚本中包含 Javascript 文件答案

【问题标题】：Including Javascript files in a Chrome extension content script在 Chrome 扩展内容脚本中包含 Javascript 文件
【发布时间】：2011-04-18 08:10:47
【问题描述】：

我正在编写一个 Chrome 扩展程序，并想编写一个 JS 文件，该文件提供几个预期的功能，而这些功能在另一个文件中不存在，然后加载另一个文件。在传递当前模块本地和全局变量时，我的行为类似于 Perl 中的 require、C 中的 #include 或 Python 中的 execfile，就好像引用的文件直接插入到当前脚本中一样。

我可以在那里找到的大多数现有解决方案都是指将这些“包含”嵌入到脚本标签中，但我不确定这是否适用（如果适用，请解释我的扩展程序将所有这些脚本标签注入的确切位置当前页面）。

更新0

请注意，我正在编写内容脚本。至少在“用户”方面，我不提供原始 HTML 文档。

【问题讨论】：

鉴于这是一个 Chrome 扩展程序，为什么你不能为所有你需要的内容使用静态
@Lloyd 这是一个内容脚本。

标签： javascript google-chrome-extension include content-script

【解决方案1】：

最好的解决方案是特定于 Chrome 的。 javascript 文件按照它们在扩展程序的manifest.json 中加载的顺序列出，这是relevant field 的摘录：

{
  "content_scripts": [
    {
      "js" : ["contentscript.js", "254195.user.js"]
    }
  ]
}

javascript 文件按照给定的顺序有效连接，然后执行。

【讨论】：

那么在 contentscript.js 中我们可以调用 254195.user.js 中的任何 var 和 function 吗？
否，因为 contentscript.js 在 254195.user.js 之前加载。这很好用：“js”：[“jquery.js”，“my-module.js”，“main.js”]。所以，jquery 可以在 my-module.js 中使用，my-module.js 可以在 main.js 中使用。

【解决方案2】：

你试过了吗：

<script language="javascript" src="otherfile.js">

或者（我不确定是哪个……但我记得其中一个在工作）

document.write('<script type="text/javascript" src="otherfile.js"></script>');

【讨论】：

这会破坏整个页面，然后消失。

【解决方案3】：

function load_script (url, cache) 
{ 

    var httpRequest = new ActiveXObject("Msxml2.XMLHTTP"); 
    httpRequest.open('GET', url, false); 

    if(!cache)
    {
        httpRequest.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT");
    }

    httpRequest.send(null);
    eval(httpRequest.responseText); 

    var s = httpRequest.responseText.split(/\n/); 
    var r = /^function\s*([a-z_]+)/i; 

    for (var i = 0; i < s.length; i++) 
    { 
        var m = r.exec(s[i]); 
        if (m != null) 
        {
            window[m[1]] = eval(m[1]); 
        }
    }
}

load_script("/script.js",true);

我们在我们的组织中使用它来执行此操作。似乎工作得很好。

【讨论】：

我们的应用程序只有 IE。很好的收获。