如何使用jquery动态加载js,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 ? "link" : "script";
var attr = isCSS ? " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' ";
var link = (isCSS ? "href" : "src") + "='" + $.includePath + name + "'";
if ($(tag + "[" + link + "]").length == 0) document.write("<" + tag + attr + link + "></" + tag + ">");
}
}
});

//使用方法
$.includePath = 'http://hi.baidu.com/javascript/';
$.include(['json2.js', 'jquery.tree.js', 'jquery.tree.css']);

赞 (0)

相关推荐

  • jquery动态加载js/css文件方法(自写小函数)

    先来看jquery自带的getSrcript文件 方法 $.getScript(url,callback) 实例 复制代码 代码如下: var testVar = 'New JS loaded!'; alert(testVar); function newFun(dynParam) { alert('You just passed '+dynParam+ ' as parameter.'); } 动态调用方法 复制代码 代码如下: <script type="text/javascript

  • 模拟jQuery中的ready方法及实现按需加载css,js实例代码

    一.ready函数的实现经常用jQuery类库或其他类库中的ready方法,有时候想想它们到底是怎么实现的,但是看了一下jQuery中的源码,涉及到的模块比较多,(水平有限)代码比较难看懂:自己结合了一些书籍内容,总结一下.先说一下ready函数的实现思路:变量ready通过表达式赋值,右侧为一个自执行匿名函数,在这个匿名函数中,首先为各个浏览器的事件绑定处理函数,并为isReady赋值(根据事件异步处理程序来确定),然后返回一个传参闭包,在闭包中,主要判断isReady值来执行操作,如果dom

  • 使用jquery动态加载Js文件和Css文件

    如果你有很多关联的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].r

  • jQuery动态加载css文件实现方法

    有时我们可能会需要使用 jQuery 来加载一个外部的 css 文件,如在切换页面布局时.思路是创建一个 link 元素,并将它添加到 标记中即可,下边首先看看怎么使用 jQuery 来实现. 下边是我喜欢的写法: $("<link>") .attr({ rel: "stylesheet", type: "text/css", href: "site.css" }) .appendTo("head&quo

  • 一个简单的动态加载js和css的jquery代码

    一个简单的动态加载js和css的jquery代码,用于在生成页面时通过js函数加载一些共通的js和css文件. //how to use the function below: //$.include('file/ajaxa.js');$.include('file/ajaxa.css'); //or $.includePath = 'file/';$.include(['ajaxa.js','ajaxa.css']);(only if .js and .css files are in the

  • 如何使用jquery动态加载js,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 =

  • 使用jQuery动态加载js脚本文件的方法

    它们很强大,但有时候也会得不偿失.如果你使用的是jQuery,它里面有一个内置的方法可以用来加载单个js文件.当你需要延迟加载一些js插件或其它类型的文件时,可以使用这个方法.下面就介绍一下如何使用它! 一.jQuery getScript()方法加载JavaScript jQuery内置了一个方法可以加载单一的js文件:当加载完成后你可以在回调函数里执行后续操作.最基本的使用jQuery.getScript的方法是这样: 复制代码 代码如下: jQuery.getScript("/path/t

  • jquery动态加载js三种方法实例

    复制代码 代码如下: <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="

  • javascript开发随笔二 动态加载js和文件

    这时候最好的做法就是按需引入,动态引入组件js和样式,文件load完成后调用callback,运行js.代码还是很简便的 1. 判断文件load完成.加载状态ie为onreadystatechange,其他为onload.onerror 复制代码 代码如下: if(isie){ Res.onreadystatechange = function(){ if(Res.readyState == 'complete' || Res.readyState == 'loaded'){ Res.onrea

  • 使用jquery动态加载js文件的方法

    方法很简单,这里就不多废话了,直接奉上代码: 复制代码 代码如下: $.extend({      includePath: '',      include: function(file) {         var files = typeof file == "string" ? [file]:file;         for (var i = 0; i < files.length; i++) {             var name = files[i].repl

  • 异步动态加载JS并运行(示例代码)

    如下所示: 复制代码 代码如下: (function(){var ga=document.createElement('script');ga.type?=?'text/javascript';?ga.async?=?true;ga.src?=?('https:'?==?document.location.protocol???'https://ssl'?:?'http://www')?+?'.google-analytics.com/ga.js';    var?s?=?document.ge

  • 异步动态加载js与css文件的js代码

    jquery动态加载css,js文件方法简单很, 例 方法1: 代码如下 复制代码 代码如下: $.getscript("test.js"); 方法2: 代码如下 复制代码 代码如下: function loadjs(file){ var head = $('head').remove('#loadscript'); $("<scri"+"pt>"+"</scr"+"ipt>").a

随机推荐