js资源引入的优化方案

第一次打开一个页面时，需要从服务器下载js、css、html等资源文件（第二次打开会从本地缓存中读取，所以只有第一次需要下载）。有时js文件过多，会拖慢网页打开的速度。

项目中有这么一个页面，需要引用很多js文件，但有些文件并不是在页面初始化时就要用到，而是在进行某种操作（例如打开弹窗）后才会用到。

为优化网页打开的速度，考虑采取按需加载的方案来引入js。项目用的是jQuery库，jQuery中提供了$.getScript()方法，通过 AJAX 请求来获得并运行一个 JavaScript 文件。

需要优化的页面中有一个js文件是在点击按钮打开弹窗之后才会用到，那么就可以在按钮点击的click事件中请求该js文件，而不是在一开始就引入。为避免多次点击按钮导致多次请求js，可定义一个参数记录该js的引入状态，已经引入了的无需重复引入。

示例代码：

window.testScript = false;

$('#btn).click(function(){
   if(!window.testScript){
       $.getScript('testScript.js',function(){
            window.momentScript = true;
            $('#textModal').modal('show');
        });
    }else{
        $('#textModal').modal('show');
    }
});