以下是遇到的幾種動態加載JavaScript文件的方式,持續更新中。。
一、使用document.write/writeln()方式
該種方式可以實現js文件的動態加載,原理就是在重寫文檔流,這種方式會導致整個頁面重繪。
實現方式:
代碼如下:document.writeln("<script src=\"http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js\"></script>");
需要注意的是特殊字符的轉義。
二、使用jQuery
使用getScript(url,callback)方法實現動態加載js文件
$.getScript('test.js',function(){ alert('done'); });
三、使用原生js方法
原理:動態創建script標簽,并指定script的src屬性
function loadJs(url,callback){ var script=document.createElement('script'); script.type="text/javascript"; if(typeof(callback)!="undefined"){ if(script.readyState){ script.onreadystatechange=function(){ if(script.readyState == "loaded" || script.readyState == "complete"){ script.onreadystatechange=null; callback(); } } }else{ script.onload=function(){ callback(); } } } script.src=url; document.body.appendChild(script); } loadJs("test.js",function(){ alert('done'); });
還可以使用同樣的原理動態加載css文件,只不過插入的的父節點是head標簽。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com