Posted by & filed under Uncategorized.

About wangcui

wangcui wangcui has written 13 post in this blog.

转载于http://qianduanblog.com/post/jquery-getscript-2.html

1、getScript方法介绍

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

——官方如是说

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

  1. $.ajax({
  2. url: url,
  3. dataType:“script”,
  4. success: success
  5. });

getScript是它的高级用法,如get、post、getJSON差不多,都是基于ajax的运用和延伸。可以这么用:

  1. $.getScript(“ajax/test.js”,function(data, textStatus, jqxhr){
  2. console.log(data);//data returned
  3. console.log(textStatus);//success
  4. console.log(jqxhr.status);//200
  5. console.log(‘Load was performed.’);
  6. });

完整使用方法是这样的:

  1. $.getScript(“ajax/test.js”)
  2. .done(function(script, textStatus){
  3. console.log( textStatus );
  4. })
  5. .fail(function(jqxhr, settings, exception){
  6. $(“div.log”).text(“Triggered ajaxError handler.”);
  7. });
  8. //如果需要指明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里面的部分内容是这样的:

  1. // other code
  2. // 部分1
  3. $(funtion()
  4. {
  5. alert(1);
  6. });
  7. // 部分2
  8. $(window).load(function()
  9. {
  10. alert(2);
  11. });
  12. // other code

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

遇到这样的问题,解决办法有2:

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

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

【完】

Leave a Reply

  • (will not be published)