jQuery 中有一个方法 getScript,它似乎可以动态加载脚本,示例如下:
$.getScript("itpow.js", function (){ foo(); // foo() 是 itpow.js 中的一个方法 });
说明一、第一个参数的路径问题
可以相对路径,也可以绝对路径。但是如果是相对路径,那么它是相对于当前 HTML 文件的路径,而不是相对于 JS 文件的路径。
说明二、跨域问题
这个 getScript 实际上就是 $.ajax,指定参数 dataType 为 "script",实际上还是 Ajax 加载。
$.ajax({ url: url, dataType: "script", success: success });
那么,是否存在跨域问题呢?jQuery 1.2 以前的确是存在,但是 jQuery 1.2 及以后,就不存在了。
说明三、外部可以使用动态加载的 JS 中的方法吗?
由于是 Ajax,所以它并没有创建 script 标签,所以出了回调方法,我们可以使用动态加载的 JS 中的方法吗?
答案是可以的。
$(window).ready(function (){ $.getScript("itpow.js", function (){ foo(); // foo() 是 itpow.js 中的一个方法 setTimeout(foo, 3000); // YES }); setTimeout(foo, 3000); // NO setTimeout(function () { // YES foo(); }, 3000); });
在上述代码中,有 3 个 setTimeout,其中有一个注释为 NO 的不能执行,因为它过早地告诉浏览器有个 foo,虽然 JavaScript 是解释型语言,虽然要 3 秒后才执行,但是由于它在“根”下面,浏览器首次“过”脚本的时候,遇到它要出错。