首页 > 网站 > WEB开发 > 正文

js文件最后加载(在window.load事件发生后再加载js文件),用于解决因jQuery等js库导致网页加载慢的问题

2024-04-27 14:16:54
字体:
来源:转载
供稿:网友
js文件最后加载(在window.load事件发生后再加载js文件),用于解决因jQuery等js库导致网页加载慢的问题

需引入文件:lazyload-min.js

<script src="JS/lazyload-min.js" type="text/javascript"></script>

插入代码:

function loadscript() {            LazyLoad.loadOnce([                'JS/touch.js',                'http://libs.baidu.com/jquery/1.2.3/jquery.min.js'            ], loadComplete);        }setTimeout(loadscript, 0);

实现在window.load事件完成0秒后加载touch.js与jquery.min.js两个文件

我们知道在PC浏览器上DOM加载顺序为:

  1. 解析HTML结构。
  2. 加载外部脚本和样式表文件。
  3. 解析并执行脚本代码。
  4. 构造HTML DOM模型。
  5. 加载图片等外部文件。
  6. 页面加载完毕。

在移动浏览器特别是移动壳应用浏览网页的时候,会先加载js文件再加载其他结构,如果加载的js文件较多,会让用户看到很长时间的白屏状态,降低用户体验。

还可以加上$("img").lazyload(); 使图片最后加载,当然要先引入jQuery。


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表