javascript - 等待脚本对象加载

Question

我正在尝试创建一个 jquery 脚本，该脚本将从谷歌浏览器的控制台运行并分析页面。我的问题是当我运行以下代码时：

var jq = document.createElement('script');
jq.src = "http://code.jquery.com/jquery-latest.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
alert($('a'));

我收到一个带有 null 的消息框（错误结果）但是如果我将它分成这样的执行：

步骤1：

var jq = document.createElement('script');
jq.src = "http://code.jquery.com/jquery-latest.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);

第2步：

alert($('a'));

它效果很好，我得到了 [object] 这是我想要的结果。

问题是我该怎么做才能在一个批次中运行它？

Answer 1

通常，您需要在script nodes onload事件上附加一个侦听器。jQuery 在完全传输和执行之前将不可用。喜欢

var jq   = document.createElement('script'),
    head = document.head || document.getElementsByTagName('head')[0] || document.documentElement;

    jq.src = "http://code.jquery.com/jquery-latest.min.js";
    jq.onload = jq.onreadystatechange = function() {
    if(!jq.readyState || /loaded|complete/.test( jq.readyState ) ) {
        jq.onload = jq.onreadystatechange = null;
        jq = undefined;
    }
}

head.insertBefore(jq, head.firstChild);

上面的代码非常坚如磐石，也可以在 IE6+ 中运行。

Answer 2

您可以尝试这样的事情并检查脚本的就绪状态：

jq.onreadystatechange = function() {
  if (this.readyState == 'complete') {
     alert($('a'));
  }
}

Answer 3

如果您想要一个可靠的方法并测试完整的脚本负载的侦听器，请尝试第三方库，例如：http: //yepnopejs.com/

不推荐从头开始一个脚本加载器，今天也不推荐。