Question

我想知道是否有一个javascript“include”函数（类似于python中的那个），我正在寻找一些但除了$.load()和google.load()之外找不到的东西。< / p>

所以，我冒昧地创建了一个脚本，这样做只是为了好玩，所以：

var include = function( lib ) {
// start with jQuery
    if(lib == "jquery") {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "http://code.jquery.com/jquery.min.js";
        script.defer = "defer"; // should I use script.setAttribute('defer', 'defer')?
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(script, s);
    }
}

然后，在另一个脚本中：

include("jquery");
$("p").innerHTML = "Worked!";

但我收到错误 $未定义

这是有道理的，因为脚本在加载jQuery之前运行。所以我的问题是，有没有办法确保include脚本在之前运行之前的任何其他内容？我看过callback解决方案看起来像这样：

include("http://code.jquery.com/jquery.min.js", function() { $("p").innerHTML = "Worked!"; });

但我确实想知道是否有任何东西（比如我上面提出的那样）更加整洁。

非常感谢任何帮助！

Answer 1

你在这里重新发明轮子：有大量的库/组件基本上做同样的工作，但有更多的功能。检查Asynchronous Module Definition API和RequireJS是否有开始。

Answer 2

由于JavaScript运行的方式，没有办法比那更干净。您可以使用某种间隔来加载所需的所有文件，就像这样。

window.includeFiles = [];
function include(file){
   window.includeFiles.push(file);
}
function initialize(callback){
   for(var i = 0; i < window.includeFiles.length; i++){
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src = window.includeFiles[i];
      script.defer = "defer"; // should I use script.setAttribute('defer', 'defer')?
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(script, s);
      if((i+1)==window.includeFiles.length){
         callback();
      }
   }
}

基本上这会让你像这样：

include("http://code.jquery.com/jquery.min.js");
include("http://code.jquery.com/jquery.min.js");
include("http://code.jquery.com/jquery.min.js");
include("http://code.jquery.com/jquery.min.js");
include("http://code.jquery.com/jquery.min.js");
initialize(function(){
  //code ready
});

唯一的问题是它不测试网络，只能通过检查包含的库中是否有可用的功能来实现。 Witch让raina77ow回答使用RequireJS更好的解决方案。

Answer 3

我认为最简单的方法是使用head.js http://headjs.com/

head.js(
  "/path/to/jquery.js", 
  "/google/analytics.js", 
  "/js/site.js", function() {

   // Code that executes when all the scripts have been loaded

});

JavaScript“包含”功能？

3 个答案: