html页面用js引入js的方式

最原始的是用script便签:

<script type="text/javascript" src="http://xxx.xx/xxx.js"></script>

1. 使用js打印这个便签:

<script type="text/javascript">
 document.write('<script src="http://xxx.xx/xx.hs"><\/script>');
</script>

当然这也可以动态引入css以及其他html元素。

2. 使用dom的api添加script元素:

<script type="text/javascript">
var script = document.createElement("script");    
script.src = "http://xxx.xx/xx.js";
document.getElementsByTagName('head')[0].appendChild(script);
</script>

jQuery中封装了这种方式,并贴心的加入了回调:

$.getScript(url,callback(res, status));

简单实现如下:

var getScript = function(url, callback) {
  var js = document.createElement('script');
  js.setAttribute('type', 'text/javascript'); 
  js.setAttribute('src', url); 
  document.getElementsByTagName('head')[0].appendChild(js);
  
  if(callback && typeof callback == 'function'){
    if (document.all) { //IE
      js.onreadystatechange = function() {
        if(js.readyState == 'loaded' || js.readyState == 'complete'){
            callbackFn();
        }
      }
    }else{
      js.onload = function() {
        callbackFn();
      }
    }
  }
}

 


版权声明:本文为ccor2002原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。