Home  >  Article  >  Web Front-end  >  Use jquery to dynamically load Js files and Css files_jquery

Use jquery to dynamically load Js files and Css files_jquery

WBOY
WBOYOriginal
2016-05-16 15:35:161319browse

If you have many related CSS files that you want to load together, or want to load different CSS files dynamically, then the following method will definitely be helpful to you.
Jquery dynamically loads Js and Css extension methods

$.extend({ 
   includePath: '', 
   include: function(file) { 
    var files = typeof file == "string" ? [file]:file; 
    for (var i = 0; i < files.length; i++) { 
      var name = files[i].replace(/^\s|\s$/g, ""); 
      var att = name.split('.'); 
      var ext = att[att.length - 1].toLowerCase(); 
      var isCSS = ext == "css"; 
      var tag = isCSS &#63; "link" : "script"; 
      var attr = isCSS &#63; " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' "; 
      var link = (isCSS &#63; "href" : "src") + "='" + $.includePath + name + "'"; 
      if ($(tag + "[" + link + "]").length == 0) document.write("<" + tag + attr + link + "></" + tag + ">"); 
    } 
  } 
}); 

Usage:

$.include('http://www.jb51.net/include/dedeajax.js'); 
$.include('http://www.jb51.net/templets/skins/style/android.css'); 

or:

$.includePath='www.jb51.net/html/'; 
$.include([dedeajax.js','android.css']); 

The above is the entire content of this article, I hope it will be helpful to everyone’s study.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn