ホームページ  >  記事  >  ウェブフロントエンド  >  jquery を使用して Js ファイルと Css ファイルを動的にロードする_jquery

jquery を使用して Js ファイルと Css ファイルを動的にロードする_jquery

WBOY
WBOYオリジナル
2016-05-16 15:35:161270ブラウズ

関連する CSS ファイルを一緒にロードしたい場合、または異なる CSS ファイルを動的にロードしたい場合は、次の方法が間違いなく役立ちます。
Jquery は Js および Css 拡張メソッドを動的にロードします

$.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 + ">"); 
    } 
  } 
}); 

使用法:

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

または:

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

以上がこの記事の全内容です。皆様の学習のお役に立てれば幸いです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。