Question

我正在创建一个使用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的任何想法吗？

编辑：将appendChild目标从test更改为head。

Answer 1

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

什么元素是测试？

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/

在IE和Chrome中动态加载jQuery

1 个答案: