Dynamic load JS, CSS Simple implementation code _JAVASCRIPT skills

First, native JS:

/** * Load JS and css file * @param jsondata.path prefix path * @param jsondata.url need to load the JS path or CSS Path * @param jsondata.type need to load the type JS or CSS/function loadwritefiles (jsondata) {jsondata. Path = Jsondata.path!= undefined?
       Jsondata.path: ""; if (Jsondata.type = = "js") {Document.writeln ("<script type= ' text/javascript ' src= '") + Jsondata.path + JSO
       ndata.url+ "' ></script>"); else if (Jsondata.type = = "css") {Document.writeln ("<link rel= ' stylesheet ' href= ')" +jsondata.pat
       H + jsondata.url+ "' type= ' text/css '/>");        }/** * Load JS or CSS into head * @param jsondata.path prefix path * @param jsondata.url Need to load the JS path or CSS path * @param jsondata.type need to load the type JS or CSS/function loadfilestohead (jsondata
       ) {Jsondata.path = Jsondata.path!= undefined? Jsondata.path: ""; if (Jsondata.type = = "js") {var _js = document.createelement (" script ");
         _js.setattribute ("type", "Text/javascript");
         _js.setattribute ("src", Jsondata.path + Jsondata.url); _js.onload = _js.onreadystatechange=function () {if (!this.readystate| | this.readystate== ' Loaded ' | | this.readystate== ' complete ') {if ("function" = = typeof (jsondata["callback"]) && jsondata["callback")
             {jsondata["callback"].call (this); 
         }} _js.onload=_js.onreadystatechange=null; } document.getelementsbytagname ("Head") [0].appendchild (_JS);//Append to head tab} else if (Jsondata.type =
         = "css" {var _css = document.createelement ("link");
         _js.setattribute ("type", "text/css");
         _css.setattribute ("rel", "stylesheet");
         _css.setattribute ("href", Jsondata.path + Jsondata.url);
  document.getElementsByTagName ("Head") [0].appendchild (_CSS);//Append to head tag     }
     } 

Two, jquery version:

Return result with deferred object

var uiload = Uiload | |

{};

  (Function ($, $document, uiload) {"Use strict"; var loaded = [], promise = false, deferred = $.

  Deferred ();
    Uiload.load = function (SRCS) {SRCs = $.isarray (SRCS)? Srcs:srcs.split (/\s+/);
    if (!promise) {promise = Deferred.promise (); } $.each (SRCs, function (index, SRC) {promise = Promise.then (function () {return Src.indexof ('. css ') >=0 ?
    LOADCSS (SRC): loadscript (SRC);
   } );
   });
   Deferred.resolve ();
  return promise;

  };

    var loadscript = function (src) {if (loaded[src]) return loaded[src].promise (); var deferred = $.
    Deferred ();
    var script = $document. createelement (' script ');
    SCRIPT.SRC = src;
    Script.onload = function (e) {deferred.resolve (e);
    };
    Script.onerror = function (e) {deferred.reject (e);
    };
    $document. Body.appendchild (script);

    LOADED[SRC] = deferred;
  return Deferred.promise ();

  }; var loadcss = function (href) {if (loaded[hRef]) return loaded[href].promise (); var deferred = $.
    Deferred ();
    var style = $document. createelement (' link ');
    Style.rel = ' stylesheet ';
    Style.type = ' text/css ';
    style.href = href;
    Style.onload = function (e) {deferred.resolve (e);
    };
    Style.onerror = function (e) {deferred.reject (e);
    };
    $document. Head.appendchild (style);

    Loaded[href] = deferred;
  return Deferred.promise (); }) (JQuery, document, Uiload);

The above dynamic loading JS, CSS Simple implementation code is a small series to share all the content, hope to give you a reference, but also hope that we support the cloud-dwelling community.