[分享] 在js中动态加载js连接和css连接，完成之后并回调。

2015-07-08 10:38

题主

jjyu
用户名称：	jjyu
加入日期：	2012-08-31 15:07
登录次数：	104

以下代码是根据网上参考并修改后得到：

  function addLink(jsLinks, cssLinks, callback) {
    var completeTotal = 0,
      completeNum = 0;

    function createScript() {
      var script, i, j = jsLinks.length;

      function onready() {
        if (this.readyState == "loaded" || this.readyState == "complete") {
          this.onreadystatechange = null;
          completeNum++;
          if (completeNum >= completeTotal)
            callback();
        }
      }

      function onload() {
        completeNum++;
        if (completeNum >= completeTotal)
          callback();
      }

      for (i = 0; i < j; i++) {
        script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = jsLinks[i];
        document.getElementsByTagName('head')[0].appendChild(script);
        if (!callback)
          return;
        if (script.readyState) {
          script.onreadystatechange = onready;
        } else {
          script.onload = onload;
        }
      }
    }

    function createLink(url) {
      var link, i, j = cssLinks.length;
      for (i = 0; i < j; i++) {
        link = document.createElement('link');
        link.rel = 'stylesheet';
        link.href = cssLinks[i];
        document.getElementsByTagName("head")[0].appendChild(link);
      }
      if (callback)
        callback();
    }
    if (cssLinks)
      completeTotal += cssLinks.length;
    if (jsLinks)
      completeTotal += jsLinks.length;
    if (cssLinks)
      createLink(cssLinks, callback);
    if (jsLinks)
      createLink(jsLinks, callback);
  }

2015-07-09 13:31

Zhao WJ
用户名称：	zhaowj
加入日期：	2011-05-02 12:07
登录次数：	1551

谢谢 jjyu 的分享

2015-07-12 08:56

liutt1001
用户名称：	liutt1001
加入日期：	2012-09-01 12:41
登录次数：	143

大神：css回调是怎么做呢，在加载后就回调？需不需要在某个回调函数里做？

2015-07-25 10:19

jimmywang
用户名称：	jimmywang
加入日期：	2012-09-09 14:02
登录次数：	64

css加载时也有onload或onreadystatechange事件需要回调

返回开发者社区