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

 更新时间:2012年10月29日 22:56:45   作者:  
如果您要创建一个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函数触发的时候调用它,这样做的好处是减少服务器压力,是非常值得推荐的

相关文章

  • JQ图片文件上传之前预览功能的简单实例(分享)

    JQ图片文件上传之前预览功能的简单实例(分享)

    下面小编就为大家带来一篇JQ图片文件上传之前预览功能的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • Jquery绑定事件(bind和live的区别介绍)

    Jquery绑定事件(bind和live的区别介绍)

    Jquery中绑定事件有三种方法click、bind、live第一种方法很好理解,其实就和普通JS的用法差不多,只是少了一个on而已第二、三种方法都是绑定事件
    2013-08-08
  • 浅谈jQuery双事件多重加载的问题

    浅谈jQuery双事件多重加载的问题

    下面小编就为大家带来一篇浅谈jQuery双事件多重加载的问题。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • jQuery+css实现炫目的动态块漂移效果

    jQuery+css实现炫目的动态块漂移效果

    这篇文章主要介绍了jQuery+css实现的动态块漂移效果,涉及jQuery基于随机数与时间函数动态操作页面元素样式的相关技巧,需要的朋友可以参考下
    2016-01-01
  • 基于DOM节点删除之empty和remove的区别(详解)

    基于DOM节点删除之empty和remove的区别(详解)

    下面小编就为大家带来一篇基于DOM节点删除之empty和remove的区别(详解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • jQuery实现优雅的弹窗效果(6)

    jQuery实现优雅的弹窗效果(6)

    这篇文章主要为大家详细介绍了jQuery实现优雅弹窗效果 的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-02-02
  • 深入理解jQuery 事件处理

    深入理解jQuery 事件处理

    下面小编就为大家带来一篇深入理解jQuery 事件处理。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • jquery控制页面的展开和隐藏实现方法(推荐)

    jquery控制页面的展开和隐藏实现方法(推荐)

    下面小编就为大家带来一篇jquery控制页面的展开和隐藏实现方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • 表单验证插件Validation应用的实例讲解

    表单验证插件Validation应用的实例讲解

    这篇文章的内容是表单验证插件Validation应用的实例讲解,需要的朋友可以参考下
    2015-10-10
  • jQuery关键词说明插件cluetip使用指南

    jQuery关键词说明插件cluetip使用指南

    我们在做web项目的时候,经常会使用到提示效果。html自带的提示效果是label标签的title,但是这个效果过于简单和难看,并且不方便调整样式。今天我偶然发现个jQuery的插件,可以很方便的做出漂亮的提示效果。
    2015-04-04

最新评论