使用jquery动态加载javascript以减少服务器压力


Posted in Javascript onOctober 29, 2012

幸运的是,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函数触发的时候调用它,这样做的好处是减少服务器压力,是非常值得推荐的
Javascript 相关文章推荐
重载toString实现JS HashMap分析
Mar 13 Javascript
js遍历td tr等html元素
Dec 13 Javascript
js实现文本框中焦点在最后位置
Mar 04 Javascript
JS实现鼠标滑过显示边框的菜单效果
Sep 21 Javascript
详解vue.js的devtools安装
May 26 Javascript
AngularJS实现的base64编码与解码功能示例
May 17 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
JS实现深度优先搜索求解两点间最短路径
Jan 17 Javascript
优雅地使用loading(推荐)
Apr 20 Javascript
vue-router 中 meta的用法详解
Nov 01 Javascript
js判断鼠标移入移出方向的方法
Jun 24 Javascript
原生javascript如何实现共享onload事件
Jul 03 Javascript
不使用XMLHttpRequest实现异步加载 Iframe和script
Oct 29 #Javascript
js制作的鼠标悬浮时产生的下拉框效果
Oct 27 #Javascript
改进版通过Json对象实现深复制的方法
Oct 24 #Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
Oct 24 #Javascript
jquery 实现checkbox全选,反选,全不选等功能代码(奇数)
Oct 24 #Javascript
JavaScript window.document的属性、方法和事件小结
Oct 24 #Javascript
javaScript 删除字符串空格多种方法小结
Oct 24 #Javascript
You might like
php中json_decode()和json_encode()的使用方法
2012/06/04 PHP
php判断数组元素中是否存在某个字符串的方法
2014/06/14 PHP
推荐25款php中非常有用的类库
2014/09/29 PHP
php 修改上传文件大小限制实例详解
2016/10/23 PHP
JS+PHP实现用户输入数字后显示最大的值及所在位置
2017/06/19 PHP
Symfony查询方法实例小结
2017/06/28 PHP
JavaScript中把数字转换为字符串的程序代码
2013/06/19 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
jquery序列化表单去除指定元素示例代码
2014/04/10 Javascript
JavaScript使用Prototype实现面向对象的方法
2015/04/14 Javascript
在JavaScript中处理时间之getHours()方法的使用
2015/06/10 Javascript
JavaScript声明变量名的语法规则
2015/07/10 Javascript
jQuery调用WebMethod(PageMethod) NET2.0的方法
2016/04/15 Javascript
Bootstrap幻灯片轮播图支持触屏左右手势滑动的实现方法
2016/10/13 Javascript
node+experss实现爬取电影天堂爬虫
2016/11/20 Javascript
jquery实现轮播图效果
2017/02/13 Javascript
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
2017/07/08 jQuery
Vue项目webpack打包部署到Tomcat刷新报404错误问题的解决方案
2018/05/15 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
2019/04/11 Javascript
layer弹出层自适应高度,垂直水平居中的实现
2019/09/16 Javascript
微信小程序连接服务器展示MQTT数据信息的实现
2020/07/14 Javascript
Element InfiniteScroll无限滚动的具体使用方法
2020/07/27 Javascript
详解JavaScript中的数据类型,以及检测数据类型的方法
2020/09/17 Javascript
element-ui 弹窗组件封装的步骤
2021/01/22 Javascript
Python中实现远程调用(RPC、RMI)简单例子
2014/04/28 Python
对Tensorflow中的矩阵运算函数详解
2018/07/27 Python
Flask Web开发入门之文件上传(八)
2018/08/17 Python
python实现kNN算法识别手写体数字的示例代码
2019/08/16 Python
Python Mock模块原理及使用方法详解
2020/07/07 Python
Marriott国际:万豪国际酒店查询预订
2017/09/25 全球购物
Nanushka官网:匈牙利服装品牌
2019/08/14 全球购物
教师年终个人自我评价
2013/10/04 职场文书
2015年个人思想总结
2015/03/09 职场文书
经典祝酒词大全
2015/08/12 职场文书
springboot @ConfigurationProperties和@PropertySource的区别
2021/06/11 Java/Android
python 单机五子棋对战游戏
2022/04/28 Python