JS 方式加載 CSS、JS 文件：

//加載 css 文件 function includeCss(filename) {var head = document.getElementsByTagName('head')[0];var link = document.createElement('link');link.href = filename;link.rel = 'stylesheet';link.type = 'text/css';head.appendChild(link) }//加載 js 文件 function includeJs(filename) {var head = document.getElementsByTagName('head')[0];var script = document.createElement('script');script.src = filename;script.type = 'text/javascript';head.appendChild(script) }

上面這種方式很簡單，但也會出現一些問題，比如加載 JS 文件之后，需要執行 JS 內的方法，這時候偶爾會找不到方法執行，因為可能加載 JS 文件的時候，網絡卡掉了，所以，需要換種方式加載，必須在加載 JS 文件完成之后，執行 JS 內部方法。

JQuery 加載 CSS 文件：

$("head").append("<link>"); var css = $("head").children(":last"); css.attr({rel: "stylesheet",type: "text/css",href: "address_of_your_css" });

Jquery 加載 JS 文件，有兩種方式：

$.ajax({url: "js file",dataType: "script",cache: true,success: function () {//todo} });$.getScript('js file', function () {//todo });

上面兩種方式都可以，并且都是在加載 JS 文件之后，再執行 JS 內部的方法（不會出現找不到方法執行錯誤），第二種會更簡單些。

那如果我們需要加載多個 JS 文件呢？

$.when($.getScript( "/mypath/myscript1.js" ),$.getScript( "/mypath/myscript2.js" ),$.getScript( "/mypath/myscript3.js" ),$.Deferred(function(deferred){$(deferred.resolve);}) ).done(function(){//place your code here, the scripts are all loaded });

如果需要多次調用，也可以抽離出方法：

//定義 $.getMultiScripts = function(arr, path) {var _arr = $.map(arr, function(scr) {return $.getScript( (path||"") + scr );});_arr.push($.Deferred(function( deferred ){$( deferred.resolve );}));return $.when.apply($, _arr); }//調用 var script_arr = ['myscript1.js', 'myscript2.js', 'myscript3.js' ]; $.getMultiScripts(script_arr, '/mypath/').done(function() {// all scripts loaded });

本文轉自田園里的蟋蟀博客園博客，原文鏈接：http://www.cnblogs.com/xishuai/p/jquery-load-css-and-js-file.html，如需轉載請自行聯系原作者

總結

以上是生活随笔為你收集整理的JQuery 加载 CSS、JS 文件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。