跨浏览器使用回调加载JavaScript：是否有比使用iframe更好的方法？

Question

我想以编程方式加载.js文件，并在完成加载后执行一些操作。 我要包含的文件托管在将包含该文件的域中。

具体来说，我正在加载的文件是swfobject.js。 我想检查它的存在并仅在需要时加载它。

这是我到目前为止的内容：

// BHD is defined elsewhere. For this example:
var BHD = {};

BHD.uid = function () {
  return 'x'+(+(''+Math.random()).substring(2)).toString(32)+(+new Date()).toString(32);
};

BHD.include = function (file, callback) {
  var uid = BHD.uid();
  frame = document.createElement('iframe');
  frame.src = file;
  frame.id = frame.name = uid;
  frame.onload = function () {
    var s = document.getElementsByTagName('script')[0]; 
    var d = frames[uid].document.documentElement;
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.text = d.textContent||d.innerText;
    s.parentNode.insertBefore(script, s);
    callback();
    s.parentNode.removeChild(s);
    frame.parentNode.removeChild(frame);
  }
  document.documentElement.appendChild(frame);
}

这似乎有效。 不过，这是一个丑陋的骇客。 .js文件的内容已加载到iframe中，并且在iframe完成加载后，新脚本元素和iframe的内容一起被注入到主文档中。 这似乎使脚本立即加载，因此可以在之后立即调用回调。

我想知道是否有更好的方法可以做到这一点。 我正在为脚本标签寻找跨浏览器“ onload”事件的内容，或者通过其他方式来避免iframe hack。

Answer 1

IE的现代版本支持脚本元素上的load事件（并且不再支持readystate ），因此可以使用常规的load event技术，不需要多个代码路径，并且我们不再需要忍受bug 困扰的readystate 。