Question

在我想出一个动态加载的简单方法，并将存储在服务器上的HTML canvas类链接在一起之前，我花了上个月的大部分时间在墙上撞墙，但显然，在客户端初始化了（在异步环境中排序很重要时比听起来更难）。

我想知道是否有人可以帮我找到加载简单javascript脚本的方法。让我们定义一个load('foo.js')函数，它指示客户端从服务器加载脚本foo.js并将其作为javascript代码执行。

鉴于存储在服务器上的三个文件：

A.js

a = 10;

B.js

load('A.js');
b = a + 10;

C.js

load('B.js');
c = b + 10;

如果客户端发出命令load('C.js');，那么实现此目的的最简单/最可靠的方法是什么。我的一个想法是扫描代码服务器端并立即返回所有脚本。这需要最少量的php请求。但是，如果客户端之前已经请求C.js，那么脚本应该存在于客户端，这将是有用的，特别是如果C.js及其所有相关文件都很大。我考虑的另一个选项是将所有这些服务器端脚本包装在一个这样的对象中，对于上面的C.js：

{
  depenencies: ['B.js'] ,
  code : 'c.age = b.age + 10;'
}

我只是不知道如何在C.js语句之后“暂停”脚本load('B.js')的执行，然后在加载B.js后重新启动它。

编辑感谢redsqaure建议yepnope和requirejs。不幸的是，我不喜欢它们有几个原因。首先，requirejs很难（我相信我会受到批评）。我对此的主要抱怨是，如果它难以学习，我不妨自己重新创建它，在此过程中学习它，并对它有更大的控制权。其次，它要求你改变你的写作风格。切换到Dojo并且必须使用dojo.declare("ClassName", [ParentA,ParentB], {...});来声明类是一回事，但在require(['A','B',...], function(){});中包装每个代码片段是另一回事。最后，我不知道指示在哪里查找文件会有多简单。我希望用户能够定义'PATH'变量服务器端，并在'PATH'的每个文件夹/子文件夹中进行搜索

Answer 1

取决于您希望它的优化程度。您可以使用同步XHR的路由或使用回调（异步和推荐）。如果您要使用第二条路线，您的代码将类似于：

// Say C.js is dependent on A.js and B.js..
load(["A.js","B.js"], function() {       
     // code goes here    
});

修改

在你反馈你想要的东西之后再看看有些可能，但是在javascript中写的很脆弱。下面我有一个依赖加载器的示例/未经测试的实现，其中一个文件只能有一个加载调用（“file.js”）。对于多个可能的依赖项，这将更复杂。此外，我假设这些文件来自同一个域。

// Usage: load("A.js") // A.js -> B.js -> C.js window.load = (function() { var loaded = {}; return function(str, /* internally used */ callback) { if(!loaded[str]) { loaded[str] = true; $.get(str, function(data) { var matches = data.match(/load$['|"](.*)["|']$/); if(matches.length > 1) { // has deps window.load(matches[1], function() { window.eval(data); if(!!callback) callback(); }); } else { // no deps window.eval(data); } }); } } })();

Answer 2

为什么不查看像yepnope.js或require.js

这样的脚本加载器

如何创建AJAX半同步行为

2 个答案: