注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

onefish资料库

成功要素---耐得住孤独!

 
 
 

日志

 
 

用 JSL 优化 JS 文件加载  

2011-04-13 19:41:12|  分类: web |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

用传统的 script 标签载入会引起阻碍页面资源加载的的问题,使页面打开变慢。前几天看到一个叫做 JSL 的 JavaScript Loader,可以动态加载 JS 文件,并且对 JS 文件的加载进行排序,觉得非常不错,推荐一下。

JSL 的使用方法

JSL 的使用方法非常简单,只要先加载 JSL 库,并且 添加需要加载的 JS 文件路径,最后执行异步加载即可,例如:

1
2
3
4
5
<script type="text/javascript" src="jsl.js"></script>
<script type="text/javascript">
    jsl.load();
</script>

也可以只使用一个 script 标签。

1
2
3
4
<script type="text/javascript" src="jsl.js">
    jsl.load();
</script>

甚至可以同时加载多个 JS 文件,并进行排序。

1
2
3
4
5
6
7
8
<script type="text/javascript" src="jsl.js">
    jsl.add("http://mysite.com/js/global.js");
    jsl.add("http://mysite.com/js/plugins.js", 3);
    jsl.load();
</script>

方法 jsl.add() 的第二个参数为 JS 文件的加载顺序,数字越小的越早加载。

如果需要在 JS 文件加载完成以后执行函数,可以直接用 jsl.load() 加载 JS,并设置 callback。

1
2
3
4
5
<script type="text/javascript" src="jsl.js"></script>
    function(){ $('body').html('欢迎来到 CodeCTO.com') }); return false;" href="#">
    欢迎来到 CodeCTO.com
</a>

上面这段代码即为在点击链接后加载 jQuery,然后显示 “欢迎来到 CodeCTO.com” 的标语。

  评论这张
 
阅读(83)| 评论(1)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017