Javascript 如何按需加载依赖文件+；检查它们是否'；是否重新加载？

我正在尝试实现一个资产/依赖项加载器，这是我在24Ways.org的一篇旧文章中找到的。你们中的大多数人可能对此很熟悉。来自Christian Heilmann的这篇文章：

我已经修改了脚本来加载CSS文件。现在已经非常接近我想要的了。但我仍然需要做一些检查，看看资产是否已完全加载

只是想知道你们有什么想法：）

以下是我的脚本当前的样子：

var assetLoader = {
  assets: {
    products: {
      js: 'products.js',
      css: 'products.css',
      loaded: false
    },
    articles: {
      js: 'articles.js',
      css: 'articles.css',
      loaded: false
    },

    [...]

    cycle: {
      js: 'jquery.cycle.min.js',
      loaded: false
    },
    swfobject: {
      js: 'jquery.swfobject.min.js',
      loaded: false
    }
  },
  add: function(asset) {
    var comp = assetLoader.assets[asset];
    var path = '/path/to/assets/';

    if (comp && comp.loaded == false) {
      if (comp.js) {
        // load js
        var js = document.createElement('script');
        js.src = path + 'js/' + comp.js;
        js.type = 'text/javascript';
        js.charset = 'utf-8';
        // append to document
        document.getElementsByTagName('body')[0].appendChild(js);
      }
      if (comp.css) {
        // load css
        var css = document.createElement('link');
        css.rel = 'stylesheet';
        css.href = path + 'css/' + comp.css;
        css.type = 'text/css';
        css.media = 'screen, projection';
        css.charset = 'utf-8';
        // append to document
        document.getElementsByTagName('head')[0].appendChild(css);
      }
    }
  },
  check: function(asset) {
    assetLoader.assets[asset].loaded = true;
  }
}

Christian在他的文章中详细解释了这种方法。我不想再用我糟糕的英语把你们搞糊涂了：P

下面是我如何运行脚本的示例：

...

// load jquery cycle plugin
if (page=='tvc' || page=='products') {
  if (!assetLoader.assets.cycle.loaded) {
    assetLoader.add('cycle');
  }
}
// load products page assets
if (!assetLoader.assets.products.loaded) {
  assetLoader.add('products');
}

...

然而，这种方法是非常有问题的。coz资产异步加载，这意味着

products.js

中依赖于

jquery.cycle.js

的一些代码可能会在

jquery.cycle.js

加载之前继续运行，从而导致错误

---

虽然我很清楚脚本可以附加onload事件，但我不确定如何在脚本中实现它。有人愿意帮我吗？请P

为什么要重新发明轮子？Dojo有内置的，jQuery有插件

至于CSS，像平常一样缩小并预先加载它。这使事情变得更简单，而且在加载时间方面不太昂贵。

对于您可以使用的js文件，它提供了一个回调选项，以便您可以链接加载，即：

$.getScript('jquery.cycle.js',function(){ 
    $.getScript('products.js'); 
});

---

关于CSS，您可能是对的，它们组合和gzip的总大小约为30KB。也许我对这个太过优化了。我会调查你们找到的那些参考资料。非常感谢。我还发现了一个可能有用的线索。找到了一些有趣的链接：）