JS異步加載的方式有三種,我這里介紹最好的一種,另外兩種你們可以自行查詢解決(因為他們都有兼容性問題)
這樣做執行js時也不阻塞頁面,不但支持異步加載,提高頁面加載速度,還支持按需加載。
這里我封裝一個函數 傳入你要加載的js路徑地址,並且計划加載完成后調用里面的某個方法函數
function loadScript (url,callback){ var script = document.createElement('script'); script.type = "text/javascript"; if (script.readyState) { // 如果有這個屬性就是IE瀏覽器 // 這個函數只有IE瀏覽器才有,當JS文件被下載完成后就會被觸發 script.onreadystatechange = function() { // 當條件滿足 表示JS文件以及被下載完成 可以被調用了 if (script.readyState == 'complete' || script.readyState == 'loaded') { if(callback){ callback() } } } } else { // 其他主流瀏覽器 script.onload = function() { // 瀏覽下載完成js后 執行onload回調,此時就可以訪問JS文件的函數和變量了 if(callback){ callback() } } } script.src = url; // 這一句執行完成,系統就會去下載這個地址里的東西,並且也是異步的去下載 document.head.appendChild(script); // 當吧script插入 } loadScript('a.js',function(){ asyhello() // 加載完成后 立即執行當前加載的js里的這個函數 })
