jQuery中getScript()使用方法与优缺点分析

目前做的主题，含有大量的js，以前是全部压缩到2个文件里的，两个文件都很大，在现代浏览器中运行毫无压力。但是，对于残疾的ie来说，那简直就是受罪。会随机出现以下状况：

1、js加载无任何错误，但就是没有特效。

2、js加载总是失败。

3、js加载过慢，导致用户失去耐心。

4、js加载过多，导致浏览器性能下降不少。

目前这款主题，是越做越杂了，超过了当时简洁的想法，几乎涵盖了所有能想到的内容。所以，在对待所有浏览器相同的待遇时，ie的表现让人蛋疼不已。所以有了以下几个方法：

1、屏蔽ie的部分特效。

2、异步加载js文件，用到该文件再加载，并且不重复加载。

目前已修改完毕，等待测试。

当然，这里主要讲的就是getScript方法，这个方法是$.ajax的高级方法，就像$.post,$.get一样是封装好的ajax特殊用法。getScript可以这么用：

if($.fn.cookie)//这里以jquery-cookie.js插件为例
{
 ready_cookie();//执行需要cookie插件的函数
}
else
{
 $.getScript('jquery-cookie.js',function()
 {
  ready_cookie();//执行需要cookie插件的函数
 });
}
 
function ready_cookie()
{
 //code
}

本质是这样的：

$.ajax(
{
 url: 'jquery-cookie.js',
 dataType: "script",
 success: function()
 {
  ready_cookie();//执行需要cookie插件的函数
 }
});

这里是个简单的用法，在加载脚本的时候，脚本是不会缓存在客户端的，因为每次异步加载的时候会带上一个时间戳的。

1、getScript方法介绍

 Load a JavaScript file from the server using a GET HTTP request, then execute it.

——官方如是说
有两个特征，一是能够使用get的http请求服务器资源下载到本地，二是能够在加载完毕之后并执行这个脚本。它的深层次的写法是这样的：

$.ajax({
  url: url,
  dataType: "script",
  success: success
});
getScript是它的高级用法，如get、post、getJSON差不多，都是基于ajax的运用和延伸。可以这么用：

$.getScript("ajax/test.js", function(data, textStatus, jqxhr) {
   console.log(data); //data returned
   console.log(textStatus); //success
   console.log(jqxhr.status); //200
   console.log('Load was performed.');
});

完整使用方法是这样的：

$.getScript("ajax/test.js")
.done(function(script, textStatus) {
  console.log( textStatus );
})
.fail(function(jqxhr, settings, exception) {
  $( "div.log" ).text( "Triggered ajaxError handler." );
}); 

//如果需要指明cache等更多参数，请使用$.ajax()

2、getScript优点

正如她的特点一样，优点很明显，那就是异步请求，在页面快速载入1KB的基本js之后，然后分段依次载入100KB的脚本，当然这是假设情况。我们熟悉的QQ空间就是利用这样的原理，一步一步的部署运行环境的，能够减少客户端的压力，并且页面的呈现不会因为js庞大而戛然而止或者止步不前。

3、getScript缺点

他的缺点就是加重了客户端对服务器的请求次数。缺点相比优点来说，似乎可以忽略。

4、我所遇到的问题

第4部分才是我今天写这篇博文的主要目的。问题是这样的：

先假设有2个脚本：a.js（1KB） 和 b.js（100KB）。页面加载的时候，载入结构、样式、还有这1KB的a.js。在文档准备完毕的时候，载入b.js，即document ready的时候。这里的载入方法就是用到getScript。现在问题来了，假设100KB的b.js里面的部分内容是这样的：

// other code
 
// 部分1
$(funtion()
{
 alert(1);
});
 
// 部分2
$(window).load(function()
{
 alert(2);
});
 
// other code

两部分代码的不同点是，他们的执行条件不一样。当然，如果这样一个脚本是没有任何问题的，而一旦使用getScript方法即ajax方法载入之后，有概率不会执行第二部分的方法。这不是个例，是概率，发生的情况无法描述，没有脚本报错，页面正常不过，但就是不执行。发生的浏览器有谷歌等常用浏览器。

遇到这样的问题，解决办法有2：

1、把window.load里的代码放到ready里。（检测是否有新评论，原来是放在onload里的，现在已移步至ready中。）

2、不使用ajax引用javascript。（代码高亮脚本，原来是放在onload里的，现在已移步至页面中。）