在 IE 和 Chrome 中动态加载 jQuery

我正在创建一个使用 jQuery 的外部小部件，而不是让用户单独包含它，我想检查它是否已加载，如果没有加载，则动态加载它。

问题是我需要等到它加载后才能执行脚本的其余部分，这需要 IE 和 FF/Chrome 处理不同的事件处理程序。

如果我这样做，它在 IE8 中工作得很好：

<div id="test">
<p>This is a test.</p>
</div>

<script>
if (typeof jQuery == 'undefined') {
    s = document.createElement("script");
    s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
    if (s.addEventListener) {
        s.addEventListener("load", runScript, false);
    } else if (s.readyState) {
        s.onreadystatechange = runScript;
    }

} else {
    runScript();
}

function runScript() {
    document.getElementsByTagName('head')[0].appendChild(s);
    $('#test').css('font-size', '50px');

}
</script>

但这在 Chrome 中不起作用。但是，如果我提前附加脚本，它可以在 Chrome 中运行，但不能在 IE 中运行：

<div id="test">
<p>This is a test.</p>
</div>

<script>
if (typeof jQuery == 'undefined') {
    s = document.createElement("script");
    s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
    document.getElementsByTagName('head')[0].appendChild(s);
    if (s.addEventListener) {
        s.addEventListener("load", runScript, false);
    } else if (s.readyState) {
        s.onreadystatechange = runScript;
    }

} else {
    runScript();
}

function runScript() {

    $('#test').css('font-size', '50px');

}
</script>

关于如何使用可在 IE 和 Chrome 中运行的事件处理程序动态加载 jQuery 有什么想法吗？

EDIT:将appendChild 目标从test 更改为head。

在第一个代码中，您将在完成时将脚本附加到您正在调用的函数中！

测试是什么元素？

document.getElementsByTagName('test')[0].appendChild(s);  <-- looking for element
<div id="test">  <-- test is an id

代码应该看起来像

if (typeof jQuery == 'undefined') {
    var s = document.createElement("script");
    s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";
    if (s.addEventListener) {
        s.addEventListener("load", runScript, false);
    } else if (s.readyState) {
        s.onreadystatechange = runScript;
    }
    document.getElementsByTagName('head')[0].appendChild(s);
} else {
    runScript();
}

function runScript() {
    $('#test').css('font-size', '50px');
}

运行示例：http://jsfiddle.net/5986T/ http://jsfiddle.net/5986T/