當(dāng)前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JQuery 加载 CSS、JS 文件
生活随笔
收集整理的這篇文章主要介紹了
JQuery 加载 CSS、JS 文件
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
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) }上面這種方式很簡單,但也會出現(xiàn)一些問題,比如加載 JS 文件之后,需要執(zhí)行 JS 內(nèi)的方法,這時候偶爾會找不到方法執(zhí)行,因為可能加載 JS 文件的時候,網(wǎng)絡(luò)卡掉了,所以,需要換種方式加載,必須在加載 JS 文件完成之后,執(zhí)行 JS 內(nèi)部方法。
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 文件之后,再執(zhí)行 JS 內(nèi)部的方法(不會出現(xiàn)找不到方法執(zhí)行錯誤),第二種會更簡單些。
那如果我們需要加載多個 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 });如果需要多次調(diào)用,也可以抽離出方法:
//定義 $.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); }//調(diào)用 var script_arr = ['myscript1.js', 'myscript2.js', 'myscript3.js' ]; $.getMultiScripts(script_arr, '/mypath/').done(function() {// all scripts loaded });本文轉(zhuǎn)自田園里的蟋蟀博客園博客,原文鏈接:http://www.cnblogs.com/xishuai/p/jquery-load-css-and-js-file.html,如需轉(zhuǎn)載請自行聯(lián)系原作者
總結(jié)
以上是生活随笔為你收集整理的JQuery 加载 CSS、JS 文件的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: PL SQL导入导出sql/dmp文件
- 下一篇: mybatis 一对多_Mybatis