动态加载javascript资料
日期：2014-05-16 浏览次数：20362 次
动态加载javascript文件
动态加载javascript？很俗的一个题目，如果你已经知道如何动态加载外部javascript，那么你可以跳过这篇文章继续阅读其它的。如果你还不知道怎样动态加载外部javascript文件的话，请耐心的继续阅读。
什么时候会用到动态加载javascript文件的技术呢？其实很多的时候都有可以用到，比如从服务器端生成javascript脚本，但是用到动态加载javascript文件主要是因为前端和后端数据的交互（至少哥会在这个时候用到）。
前几天在修改移动版支付宝时，就使用了动态加载javascript文件。
记住，这里说的动态加载js文件是指利用js动态加载js文件，并非是服务器生成。
如何创建动态加载外部javascript的脚本呢？非常简单
var script = document.createElement('script');//创建script标签
script.src = 'http://mgw.alipay.com/choosePhone.htm?' + (new Date()).getTime().toString().substring(0,8);
script.type = "text/javascript";
script.characterSet = 'utf-8';
script.onload = script.onreadystatechange = function(){//兼容IE和DOM标签的script onload事件
if (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') {
alert(malipayBrands.length);
}
}
?
请注意以上代码中的script.onload = script.onreadystatechange = function (){},其中onload用于DOM标签的浏览器，onreadystatechange用于IE。
最后在head中插入我们的script
document.getElementsByTagName('head')[0].appendChild(script);
?
?
在国外已经有一个封装好的loadScript.js，代码如下：
?
function loadScript(url, callback){
var f = arguments.callee;
if (!("queue" in f))
f.queue = {};
var queue = f.queue;
if (url in queue) { // script is already in the document
if (callback) {
if (queue[url]) // still loading
queue[url].push(callback);
else // loaded
callback();
}
return;
}
queue[url] = callback ? [callback] : [];
var script = document.createElement("script");
script.type = "text/javascript";
script.onload = script.onreadystatechange = function(){
if (script.readyState && script.readyState != "loaded" && script.readyState != "complete")
return;
script.onreadystatechange = script.onload = null;
while (queue[url].length)
queue[url].shift()();
queue[url] = null;
};
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}
?
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
