jQuery动态加载JS以减少服务器压力
如果您要创建一个web2.0的应用程序,那么你的网页会包括大量的JavaScript文件,这些可能会拖慢您的网页。因此,动态加载JavaScript代码到您的网页是一个好主意,即只有当实用他们的时候加载它们。这种策略可以帮助你减少你的网页的加载时间。
幸运的是,jQuery提供了一个内置的实用函数,$getScript()为我们提供了这样的方法。来实现在网页动态的功能。来看看这个函数的语法:
$.getScript(url,callback)
获取url参数所指定的脚本,使用一个GET请求到指定的服务器
Parameters
URL()获取脚本文件的URL。
callback (Function)可选函数 调用脚本文件加载后里面的函数
具体实现过程是
从资源加载文本
如果字符串成功
返回XHR实例,用来获取脚本。
如何使用呢看下面的方法
我们创建一个new.js 脚本文件
var testVar = 'New JS loaded!';
alert(testVar);
function newFun(dynParam)
{
alert('You just passed '+dynParam+ ' as parameter.');
}
HTML代码
<html>
<head>
<title> $.getScript Example</title>
<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>
</body>
</html>
上述代码当中我们创建一个new.js的脚本文件,在body部分当button函数触发的时候调用它,这样做的好处是减少服务器压力,是非常值得推荐的。
原文链接:http://www.cnblogs.com/58top/archive/2012/10/29/loading-javascript-dynamically-using.html
jQuery动态加载JS以减少服务器压力的更多相关文章
- jquery动态加载js三种方法实例
这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getScript(\"test.js\" ...
- (一)JQuery动态加载js的三种方法
Jquery动态加载js的三种方法如下: 第一种: $.getscript("test.js"); 例如: <script type="text/javascrip ...
- jquery动态加载js/css文件方法
先来看jquery自带的getSrcript文件 方法 代码如下 复制代码 $.getScript(url,callback) 实例 代码如下 复制代码 var testVar = 'New JS l ...
- 使用jQuery动态加载js脚本
动态加载Javascript是一项非常强大且有用的技术.这方面的主题在本站已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js.它们很强大,但有时候也会得不偿失.如果你使 ...
- 使用jQuery动态加载js脚本文件的方法
动态加载Javascript是一项非常强大且有用的技术.这方面的主题在网上已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js 它们很强大,但有时候也会得不偿失.如果你使 ...
- jquery动态加载JS【方法getScript】的改进
http://www.cnblogs.com/cuitsl/archive/2012/11/15/2771549.html
- jquery动态加载 去除js
!-- 这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getscript("test.js&quo ...
- 三种动态加载js的jquery实例代码另附去除js方法
!-- 这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getscript("test.js&quo ...
- jquery getScript动态加载JS方法改进详解[转载]
转载自http://www.jb51.net/article/31973.htm 有许多朋友需要使用getScript方法动态加载JS,本文将详细介绍此功能的实现方法 $.getScript( ...
随机推荐
- 50个最常用的UNIX/Linux命令
转自http://get.jobdeer.com/493.get 1. tar command examples Create a new tar archive. $ tar cvf archive ...
- selenium _WaitForSingleObject(self._handle, 0) == _WAIT_OBJECT_0
在关闭driver时,如果用close,而不是用quit,会出现如下错误: Exception ignored in: <bound method Popen.__del__ of <su ...
- hive on spark VS SparkSQL VS hive on tez
http://blog.csdn.net/wtq1993/article/details/52435563 http://blog.csdn.net/yeruby/article/details/51 ...
- CentOS7环境下SSH端口修改笔记
CentOS7环境下SSH端口修改笔记 说明: CentOS7服务器环境,默认SSH端口为22,考虑到安全方面问题,欲修改端口为62231(机器内网IP为192.168.1.31) ssh配置文件和i ...
- shell中declare命令
declare命令有如下选项: -a 声明一个数组 -i 声明一个整型 -f 打印所有函数定义 -F 仅打印函数名字 -r 声明一个readonly变量,该变量的值无法改变,并且不能为unset -x ...
- EffectiveJava(17)要么为继承而设计,要么禁止继承
1.如果为了继承而设计类,那么该类必须有文档说明它可覆盖的方法的自用性.对于每个公有的 或受保护的方法或者构造器,它的文档必须指明该方法或者构造器调用了那些可覆盖的方法,是以 什么顺序调用的,每个调用 ...
- HUNAN Interesting Integers(爆力枚举)
Undoubtedly you know of the Fibonacci numbers. Starting with F1 = 1 and F2 = 1, every next number is ...
- Angular 学习笔记——ng-Resource
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...
- dev_queue_xmit()函数返回值问题
函数 dev_queue_xmit()用于直接使用sk_buf发包,此函数有返回值,但是并不能通过 此函数返回值为0来说明包已经发送出去且可以立刻释放sk_buff内存.因为网卡发包是一个异步的过程 ...
- poj 1390 Blocks (经典区间dp 方块消除)
Blocks Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 4250 Accepted: 1704 Descriptio ...