JsLoader Library动态加载js
(2012-07-02 18:09:10)
标签:
jquery动态加载jsit |
分类: jquery那些事 |
JsLoader Library
文章作者:Vic Yuan
转载请注明出处:http://simplesys.cn
JsLoader.js
function JsLoader() { var jsQueue = new Array(); var funQueue = new Array(); var parArr = new Array(); var domainArr = new Array(); var parStr = ''; var loadCount = 0; var isfinish = false; var dir = ''; // 浏览器类型 Browser = { ie :/msie/.test(window.navigator.userAgent.toLowerCase()), moz :/gecko/.test(window.navigator.userAgent.toLowerCase()), opera :/opera/.test(window.navigator.userAgent.toLowerCase()), safari :/safari/.test(window.navigator.userAgent.toLowerCase()) }; // 添加js文件 this.load = function(url) { if (typeof (url) == 'object') { jsQueue = jsQueue.concat(url); } else if (typeof (url) == 'string') { jsQueue.push(url); } } // 加载js this.start = function() { for ( var i = 0; i < jsQueue.length; i++) { loadJS(jsQueue[i]); } } this.call = function(fun) { if (isfinish) { fun(); } else { funQueue.push(fun); } } // 构造参数 this.build = function() { if (parArr.length > 0) { // parStr = parArr.join('&'); parStr = parArr.join('&'); } } // 增加参数 this.parameter = function(par) { if (typeof (par) == 'object') { for ( var key in par) { parArr.push(escape(key) + '=' + escape(par[key])); } } else if (typeof (par) == 'string') { parArr.push(par); } } // js地址目录 方便多语言 默认为空 this.folder = function(folder) { dir = folder; } // 添加域名 用于动静分离,服务器减压,加快下载速度 this.domain = function(url) { if (typeof (url) == 'object') { domainArr = domainArr.concat(url); } else if (typeof (url) == 'string') { domainArr.push(url); } } function loadJsFunc(sUrl, fCallback) { var _script = document.createElement_x('script'); var hd = document.getElementsByTagName_r('head')[0]; _script.setAttribute('type', 'text/javascript'); _script.setAttribute('src', sUrl); document.getElementsByTagName_r('head')[0].appendChild(_script); if (this.Browser.ie) { _script.onreadystatechange = function() { if (this.readyState == 'loaded' || this.readyState == 'complete') { fCallback(); } }; } else if (this.Browser.moz) { _script.onload = function() { fCallback(); }; } else { fCallback(); } } function loadJS(jsurl) { var tmpStr = ''; var dStr = ''; if (parStr.length > 0) { tmpStr = (jsurl.indexOf('?') > 0 ? '&' : '?') + parStr; } var dl = domainArr.length; if (dl > 0) { dStr = dl > 1 ? domainArr[jsurl.length % dl] : domainArr[0]; } loadUrl = dStr + dir + jsurl + tmpStr; loadJsFunc(loadUrl, loadFinish); } function loadFinish() { loadCount++; if (loadCount == jsQueue.length) { isfinish = true; for ( var i = 0; i < funQueue.length; i++) { funQueue[i](); } } } }
Demo:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JsLoader Demo</title> </head> <body> <div id="message">loading...</div> </body> <script type="text/javascript" src="JsLoader.js"></script> <script> var jsArr = new Array(); jsArr.push('includes/js/jquery/jquery.js'); jsArr.push('includes/js/hoverIntent.js'); jsArr.push('admin/js/common.js'); jsArr.push('includes/js/jquery/jquery.color.js'); jsArr.push('includes/js/wp-ajax-response.js'); jsArr.push('includes/js/wp-lists.js'); jsArr.push('includes/js/jquery/ui.core.js'); jsArr.push('includes/js/jquery/ui.resizable.js'); jsArr.push('includes/js/quicktags.js'); jsArr.push('admin/js/edit-comments.js'); jsArr.push('includes/js/jquery/ui.sortable.js'); jsArr.push('admin/js/postbox.js'); var manager = new JsLoader(); manager.load(jsArr); //manager.load('admin/js/dashboard.js'); // 也可以使用这种方式添加js文件 manager.parameter({version:'2.0',language:'zh-cn'}); // manager.parameter('lang=zh'); // 这种方法也可以添加参数 manager.build(); manager.folder('/wp-'); // manager.domain('http://domain1/'); // 添加域名 manager.domain(new Array('http://simplesys.cn','http://www.simplesys.cn')); // 也可以使用数组的方式 manager.start(); // 加载js manager.call(fnInit); function fnInit(){ document.getElementByIdx_x('message').innerHTML = 'init'; } </script> </html>
下载: