欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

原生JS實現(xiàn)動態(tài)加載js文件并在加載成功后執(zhí)行回調函數(shù)的方法

 更新時間：2020年12月30日 13:04:39   作者：webarn  
這篇文章主要介紹了原生JS實現(xiàn)動態(tài)加載js文件并在加載成功后執(zhí)行回調函數(shù)的方法,涉及javascript動態(tài)創(chuàng)建頁面元素、事件監(jiān)聽、回調函數(shù)使用等相關操作技巧,需要的朋友可以參考下

本文實例講述了原生JS實現(xiàn)動態(tài)加載js文件并在加載成功后執(zhí)行回調函數(shù)的方法。分享給大家供大家參考，具體如下：

有的時候需要動態(tài)加載一個javascript文件，并且在加載成功后執(zhí)行回調函數(shù)（例如文件中保存了json數(shù)據(jù)之類的）。要實現(xiàn)這樣的功能，可以使用<script> 元素的load 事件（IE9+、chrome、FireFox等）和onreadystatechange 事件（IE8以下），直接上代碼：

function loadScript(src, callback) {
 var script = document.createElement('script'),
  head = document.getElementsByTagName('head')[0];
 script.type = 'text/javascript';
 script.charset = 'UTF-8';
 script.src = src;
 if (script.addEventListener) {
  script.addEventListener('load', function () {
   callback();
  }, false);
 } else if (script.attachEvent) {
  script.attachEvent('onreadystatechange', function () {
   var target = window.event.srcElement;
   if (target.readyState == 'loaded') {
    callback();
   }
  });
 }
 head.appendChild(script);
}

調用方法示例：

loadScript('http://cdn.staticfile.org/jquery/1.6.2/jquery.min.js',function(){
 console.log('onload');
});

運行后控制臺輸出onload，如下圖所示：

補充一個函數(shù)

function sk_loadScript(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);
}

if(typeof jQuery=='undefined'){
	sk_loadScript("/comments/js/jquery.js",function(){
		sk_main();
	});
}else{
	sk_main();
}

上述代碼感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具http://tools.jb51.net/code/HtmlJsRun測試運行一下，看看運行結果如何。

更多關于JavaScript相關內(nèi)容感興趣的讀者可查看本站專題：《JavaScript文件與目錄操作技巧匯總》、《JavaScript查找算法技巧總結》、《JavaScript數(shù)據(jù)結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》、《JavaScript錯誤與調試技巧總結》及《JavaScript數(shù)學運算用法總結》

希望本文所述對大家JavaScript程序設計有所幫助。

相關文章

最新評論