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.‘);
}

动态调用方法

HTML代码

代码如下 复制代码
<script type="text/javascript" src="../jquery.js"></script>

<script type="text/javascript">

$(function()

{

$(‘#loadButton‘).click(function(){

$.getScript(‘new.js‘,function(){

newFun(‘"Checking new script"‘);//这个函数是在new.js里面的,当点击click后运行这个函数

});

});

});

</script>

</head>

<body>

<button type="button" id="loadButton">Load</button>

上面的只能动态加载js代码,但不能加载css,后来自己写了一个可加载js与css的程序。

代码如下 复制代码
$.extend({
includePath: ‘‘,
include: func(www.111cn.net)tion(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 + ">");
}
}
});
$.include([‘hdivbox.js‘,‘pop_win.css‘]);

from:http://www.111cn.net/wy/jquery/45691.htm

时间: 2024-08-19 18:08:04

jquery动态加载js/css文件方法的相关文章

jQuery动态加载js脚本文件

jQuery getScript()方法加载JavaScript jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) { /* 做一些加载完成后需要执行的事情 */ }); jQuery.getScript("/path/to/myscript.js") .done(function() { /* 耶,没有问题,这里可以干点什么 */ }) .fail(function() {

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

动态加载Javascript是一项非常强大且有用的技术.这方面的主题在网上已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js 它们很强大,但有时候也会得不偿失.如果你使用的是jQuery,它里面有一个内置的方法可以用来加载单个js文件.当你需要延迟加载一些js插件或其它类型的文件时,可以使用这个方法.下面就介绍一下如何使用它! 一.jQuery getScript()方法加载JavaScript jQuery内置了一个方法可以加载单一的js文件:当加载完成后你可以

【JS】【9】使用jQuery动态加载js文件

正文: 用法: jQuery.getScript("/path/to/myscript.js") .done(function() { /* 耶,没有问题,这里可以干点什么 */ }) .fail(function() { /* 靠,马上执行挽救操作 */ }); 例子:延迟加载一个js插件,而且在加载完成时执行它 jQuery.getScript("jquery.cookie.js") .done(function() { jQuery.cookie("

javascript异步延时加载及判断是否已加载js/css文件

引用就是某一变量(目标)的一个别名,对引用的操作与对变量直接操作完全一样. 引用的声明方法:类型标识符 &引用名=目标变量名: 例如: int a int &b=a; //定义引用b,它是变量a的引用,即别名 #include <stdio.h> void main() { int a = 123; int &b = a; printf("a=%d b=%d\n", a, b); } 执行结果: 实例:引用和变量的关系 #include <io

动态加载js css 插件

简介 动态加载js,css在现在以及将来肯定是很重要的.目前来看前端代码编写的业务量已经远远超过后端编写的.随着对用户体验度逐渐增强,前端业务复杂,加载速度变得很慢很慢.为了解决这个问题,目前出现的两个前端模块加载器为require.js与sea.js,这两款模块加载器都不错.但是呢,有时候我仅仅需要的只是动态加载一个js,不需要把代码模块化,那我们只能自己手写一个加载函数. 简单的加载js /** * HTML动态加载js * @path {String} src地址必须带有后缀名.js *

动态加载js,css(项目中需要的)

最近做的一个项目需要加入百度统计,大家都知道百度统计在页面引用就是一坨js,实现方法很简单引用到页面就ok了. 那么问题来了,虽然我不知道百度统计的原理是啥,我的测试服引用了百度统计,百度统计账号里面配置的域名是正式服的域名,但是却检测到了我测试服的访问量,这就尴尬了,然后就想到了动态加载js 1.动态加载js文件 我们要把这块链接加入页面 <script src="js/count.js"></script> 具体代码实现如下 function loadJs(

JS动态加载 js css

1.动态加载js function loadScript( url ){ var script = document.createElement( "script" ); script.type = "type/javascipt"; script.src = url; document.getElementsByTagName( "head" )[0].appendChild( script ); }; 2.动态加载CSS文件 function

laravel 单页面按需加载js/css文件

我们常把公共的header以及footer提炼出来,但是每个子页面的css和js又不相同,如果都写在了父模板里,对不需要的子模板来说是负担,造成不必要的开销,此时就需要按需加载,laravel给我们提供了这样的便利 父模板里 在需要加载 js/css 的位置写入 @stack('backend-register-js') 子模板 @push('backend-register-js') <script> js代码 </script> @endpush ********或者*****

按需加载.js .css文件

首先,理解按需加载当你需要用到某个js里面的函数什么鬼,或者某个css里的样式的时候你才开始加载这个文件. 然后是怎样实现的,简单来说就是在js中动态的createElem<script><link>这两种元算--这句话是说给自己的.可以绑定点击事件,滚轮事件(例如图片的懒加载是动态的.) 使用 require.js (一个按需加载的插件)管理.js按需加载,来自http://www.cnblogs.com/chenxizhang/archive/2013/05/16/308194