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

大型的网站中会包括大量的JavaScript文件,大量的加载会拖慢您的网站。因此,动态加载JavaScript代码到您的网站是一个不错的选择,即只有当实用他们的时候加载它们。

jQuery提供了一个内置的实用函数,$getScript() 为我们提供了这样的方法。来实现在网页动态的功能。来看看这个函数的语法:

$.getScript(url,callback)

 

获取url参数所指定的脚本,使用一个GET请求到指定的服务器

Parameters

URL 获取脚本文件的URL。

callback (Function) 可选函数 调用脚本文件加载后里面的函数。

如何使用呢看下面的方法

我们创建一个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函数触发的时候调用它,这样做的好处是减少服务器压力,是非常值得推荐的

 

你可能感兴趣的:(使用jquery动态加载javascript以减少服务器压力)