動態 載入和執行js檔案
阿新 • • 發佈:2018-12-19
也可以參考:https://blog.csdn.net/WeilaPls/article/details/84712521 (多種識別移動端的方式)
頁面載入先判斷裝置,是pc還是移動,然後動態載入相應的js檔案。以下有兩個方法:
方法一:
function is_pc(){ var os = new Array("Android","iPhone","Windows Phone","iPod","BlackBerry","MeeGo","SymbianOS"); // 其他型別的移動作業系統型別,自行新增 var info = navigator.userAgent; var len = os.length; for (var i = 0; i < len; i++) { if (info.indexOf(os[i]) > 0){ return false; } } return true; } if(!is_pc()){ document.write('<scr'+'ipt src="'+'a.js?_bid=152'+'"></scr'+'ipt>'); document.write('<scr'+'ipt src="'+'zepto.min.js'+'"></scr'+'ipt>'); document.write('<scr'+'ipt src="'+'b.js'+'"></scr'+'ipt>'); document.write('<scr'+'ipt src="'+'c.js'+'"></scr'+'ipt>'); }else { document.write('<scr'+'ipt src="'+'c.js'+'"></scr'+'ipt>'); document.write('<scr'+'ipt src="'+'d'+'"></scr'+'ipt>'); document.write('<scr'+'ipt src="'+'e'+'"></scr'+'ipt>'); } //if判斷這裡也可以如下寫法,注意轉義 if(!is_pc()){ document.write('<script src="'+'a.js?_bid=152'+'"><\/script>'); document.write('<script src="'+'zepto.min.js'+'"><\/script>'); document.write('<script src="'+'b.js'+'"><\/script>'); document.write('<script src="'+'c.js'+'"><\/script>'); }else { document.write('<script src="'+'c.js'+'"><\/script>'); document.write('<script src="'+'d.js'+'"><\/script>'); document.write('<script src="'+'e.js'+'"><\/script>'); }
方法二:
//動態載入一個js檔案的方法封裝 function loadScript(a, b, z) { var c = document.createElement("script"); c.async = false; if (z) { c.charset = "utf-8"; } c.type = "text/javascript", c.readyState ? c.onreadystatechange = function() { ("loaded" == c.readyState || "complete" == c.readyState) && (c.onreadystatechange = null, b && b()); } : c.onload = function() { b && b(); }, c.src = a, document.body.appendChild(c); } //純js(不使用jquery的封裝),功能同上 function loadScript(url, callback) { var script = document.createElement("script") script.type = "text/javascript"; if (script.readyState) { //IE script.onreadystatechange = function () { if (script.readyState == "loaded" || script.readyState == "complete") { script.onreadystatechange = null; callback(); } }; } else { //Others script.onload = function () { callback(); }; } script.src = url; document.getElementsByTagName("head")[0].appendChild(script); }
使用:
//場景: pc下的載入 和 非pc的檔案載入 if(!is_pc()){ // 載入js loadScript("a.js", function(){ loadScript("b.jss", function(){ loadScript("c.js", function(){typeId="m";ulogin(); loadScript("d.js", function(){uafun();}); }); }); }) }else{ loadScript("b.js", function(){ typeId="pc";ulogin(); loadScript("a.js"), loadScript("d.js"); }) } //方法二 loadScript("script1.js", function(){ alert("File is loaded!"); });