- 浏览: 592818 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (199)
- 纯java (22)
- 中间件 (1)
- java线程 (1)
- webwork (10)
- HTML/CSS (11)
- struts2 (10)
- mysql (14)
- Linux (8)
- 字符编码和转换 (1)
- WebService (1)
- web (21)
- javascript (33)
- ajax (5)
- 随便写写 (3)
- svn (0)
- eclipse使用技巧 (10)
- Ant (1)
- 互联网发展方向 (1)
- Jquery (12)
- 视频 (2)
- MD5 (1)
- 项目经验总结 (1)
- Oracle (2)
- Netbeans (1)
- Apache/Tomcat (4)
- springside (1)
- hibernate (6)
- SpringSecurity (0)
- java与文件 (1)
- CKEditor (4)
- JSON (3)
- 笔试题 (0)
- 应用部署 (1)
- 杂七杂八 (1)
- android (1)
- jQuery UI (1)
- XML相关技术 (1)
- HTML5 (1)
- CSS3 (0)
- 正则表达式 (1)
- http协议 (3)
- 算法 (5)
- 互联网知识 (1)
最新评论
-
hp321:
我现在遇到一个开发自定义按钮的问题,想请教下你:问题如下:举例 ...
Ckeditor 如何在源码模式下添加可以显现的按钮 -
make1828:
javascript跨域解决方案(一) -
huxianwen:
问题是, ckeditor编辑器在源码模式并不能插入任何代码呀 ...
Ckeditor 如何在源码模式下添加可以显现的按钮 -
nidonglin1986:
虽然解决了问题,但是原因说的不是很明白啊。中文跟HTML标志 ...
struts2的标签在JS中的使用 中文乱码 -
ldw1986hf123:
[*]
JVM工作原理
javascript延迟加载的解决方案:
1.使用defer标签
<script type="text/javascript" src="load.js" defer></script>
2.使用XMLHttpRequest对象加载
var xhr = new XMLHttpRequest();
xhr.open("get","load.js",true);
xhr.onreadystatechange=function(){
if(readyState==4){
if(status>=200&&status<300||status==304){
var script = document.createElement("script");
script.type = "text/javascript";
script.src = xhr.responseText;
document.body.appendChild(script);
}
}
}
xhr.send(null);
3.使用推荐的无阻塞模式:
function loadScript(url , callback){ var script = document.createElement("script"); script.type="text/javascript"; if(script.readyState){ script.onreadystatechange = function(){ if(script.readyState=="loaded"||script.readyState=="complete"){ script.onreadystatechange=null; callback(); } } }else{ script.onload = function(){ callback(); } } script.src = url; document.getElementsByName("head")[0].appendChild(script); }
4.HTML5中可以使用async方式设置异步加载js
<script type="text/javascript" src="load.js" async="true"></script>
关于JS异步加载的测试
对IE8和Firefox3.6测试结果:
1.常规的在head里面使用Script标签引用js,不再是堵塞模式加载(也就是说脚本文件不再是一个一个被加载,加载完成一个才开始加载另一个),而是最
大6个JS同时开始加载(并发限制为6个),但是script的执行顺序还是按照Script标签顺序,而且会阻碍页面的呈现。
2.由于1的原因,所以使用document.write("<script>...</script>")(此方式对Firefox无效)的方式和head.append(script)(此方式兼容IE和Firefox)的方式
使用异步加载意义不大
3.但是使用head.append(script)的方式,不会阻碍界面的呈现,但是要注意:
(1)如果对于window.onload事件的触发有所影响:在 IE中,window.onload事件会在页面其它元素被加载完毕之后立即触发(即不必等所有脚本加载完,而
是html页面加载完),而FireFox里的window.onload事件会等待动态添加的那些脚本文件也被加载完毕后才触发。
(2)虽然我们动态加载的script元素是有严格顺序的,但是浏览器可不一定这样认为。在FireFox中,脚本文件会按照它动态加载的script元素的顺序执
行,而IE会根据脚本文件下载完毕的顺序执行。
注意:
1.在IE6和IE7中,常规的在head里面使用Script标签引用js,是堵塞模式加载,也就是说必须加载完一个JS,才能去加载下一个JS
2.在IE6和IE7中,并发限制是2个。也就是即使使用head.append(script)的方式异步加载3个JS,也会等前两个JS加载完成以后才会加载第三个JS。
1.常规的在head里面使用Script标签引用js,不再是堵塞模式加载(也就是说脚本文件不再是一个一个被加载,加载完成一个才开始加载另一个),而是最
大6个JS同时开始加载(并发限制为6个),但是script的执行顺序还是按照Script标签顺序,而且会阻碍页面的呈现。
2.由于1的原因,所以使用document.write("<script>...</script>")(此方式对Firefox无效)的方式和head.append(script)(此方式兼容IE和Firefox)的方式
使用异步加载意义不大
3.但是使用head.append(script)的方式,不会阻碍界面的呈现,但是要注意:
(1)如果对于window.onload事件的触发有所影响:在 IE中,window.onload事件会在页面其它元素被加载完毕之后立即触发(即不必等所有脚本加载完,而
是html页面加载完),而FireFox里的window.onload事件会等待动态添加的那些脚本文件也被加载完毕后才触发。
(2)虽然我们动态加载的script元素是有严格顺序的,但是浏览器可不一定这样认为。在FireFox中,脚本文件会按照它动态加载的script元素的顺序执
行,而IE会根据脚本文件下载完毕的顺序执行。
注意:
1.在IE6和IE7中,常规的在head里面使用Script标签引用js,是堵塞模式加载,也就是说必须加载完一个JS,才能去加载下一个JS
2.在IE6和IE7中,并发限制是2个。也就是即使使用head.append(script)的方式异步加载3个JS,也会等前两个JS加载完成以后才会加载第三个JS。
发表评论
-
Javascript的分层概念
2011-12-07 17:27 1271Javascript如何分层: 我们把 ... -
一道诡异的js面试题
2011-11-09 17:46 1904请给出如下两段程序的执行结果: 第一种情况: <sc ... -
JavaScript在IE和Firefox下的兼容性问题
2011-11-09 16:45 1717(一) 问题1:获取一个元素对象的引用,在IE下,可直接使用该 ... -
Jquery性能优化
2011-11-08 15:47 1047之前,我们减少字节数 ... -
雅虎网页优化14条准则
2011-11-04 15:27 1478网站最基本的东西是什么? ——内容?SEO(搜索引擎优化)?U ... -
对String对象进行扩展,使其具有去掉字符串前后空格的方法
2011-11-02 11:27 1840通过正则表达式可以实现题目要求具体代码如下: <htm ... -
前端开发性能优化规范
2011-11-01 11:00 1网站性能优化是一个很综合的话题,涉及到服务器的配置和网站前后端 ... -
javascript跨域解决方案(二)
2011-10-28 16:45 15283.4、iframe+location.hash 这种方法比 ... -
javascript跨域解决方案(一)
2011-10-28 16:42 107371、神马是跨域(Cross Domain) 说白点就是p ... -
如何确保页面中的js加载完全
2011-10-28 11:19 1520如何确定一个js是否加载完全或者页面中的所有js加载完全,具体 ... -
javascript性能优化准则
2011-10-28 10:54 14javascript性能优化准则: 1.将脚本放在底部 2 ... -
js字符串连接性能问题
2011-10-27 21:00 1104大多数情况下,加法运算符是首选;如果用户主要使用IE ... -
javascript闭包概念的理解
2011-10-27 09:17 13111.什么是闭包? 闭包,就是封闭了外部函数作用域中 ... -
点击页面标签弹出 标签名字的两种方式
2011-10-26 15:36 1281第一种解决办法是jquery的方式: <script ... -
js中innerHTML、outHTML和innerText的用法与区别
2011-10-19 16:15 6087js中innerHTML与innerText的用法与区别 用法 ... -
JavaScript js 兼容浏览器问题 兼容FireFox(FF)、IE的解决方法
2011-10-17 16:25 1482做BS开发就难免会用到ja ... -
Js中的undefined,null,NaN,Bool以及类型判断
2011-07-21 19:35 41891.类型分析: jav ... -
js单引号中嵌套单引号的问题的正确写法
2011-06-16 11:25 3117例如我们要写如下一段代码: this.div.InnerHT ... -
不唐突的JavaScript的七条准则
2011-04-25 11:03 1049经过多年的开发、教学和编写不唐突的JavaScript, 我发 ... -
javascript数组定义
2011-04-21 13:56 1125数组有四种定义的方式 使用构造函数: var a = new ...
相关推荐
默认情况javascript是同步加载的,javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,接下来将为你详细介绍下异步加载js三种实现方案,
本篇文章给大家分享了作者在学习JavaScript异步加载中遇到的问题,总结后给出了详细的处理方案,有兴趣的朋友可以学习下。
默认情况javascript是同步加载的,也就是javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,对于一些意义不是很大的javascript,如果放在页头会导致加载很慢的话,是会严重影响用户...
JavaScript 加载器在 Web 开发中是非常强大和有用的工具。目前流行的几个加载器,像 curljs、LABjs 和 RequireJS 使用都很广泛。他们功能强大的,但有些情况下可以有更简单的方案。 如果你正在使用 jQuery,有一个...
本插件意在无痛解决vue处理异步数据的一揽子问题。包括异步的computed以及异步data,以及提供其相关服务端的方案
js异步加载的4种方式,点评开始。 方案1:$(document).ready <!DOCTYPE html> <html> <head> [removed][removed] [removed] $(document).ready(function() { alert("加载完成!"); })
DySEL-动态顺序外部加载器DySEL是一个异步顺序资源(JavaScript和CSS)加载器。 它堆叠资源并加载它们,以便仅在上一个资源完成后才加载下一个资源。 您可以设置最终的回调,该回调将在所有加载结束时执行。 如果要...
与许多其他脚本加载器不同,asyncJS 可以异步加载内联函数和脚本字符串以及外部 JavaScript 文件。 asyncJS使用类似 Defer 的队列来跟踪任务,允许您附加额外的任务、附加额外的回调以及处理回调中的错误,使其...
比如执行懒加载时候,onscroll 事件触发多次事件时候会调用多次 ajax 回调事件,由于每个事件返回先后次序并不能保证和触发前一致,所以在数据响应返回后所添加的数据顺序就很在 push 到数组上顺序不一致。...
AsyncFetcher是一个简单实用的React (web或native)组件,用于借助异步加载/获取在线数据。安装由于该库是基于JS的解决方案,因此只需运行以下命令即可安装最新版本的react-async-fetcher : $ npm install --save ...
react-router为前端的SPA应用提供一种非常优雅的路由方案,但是还么有一个完善的异步方案,虽然已有些眉目。 因为router的handler是一个react的组件,如果我们在代码中大量的通过require或者import(es6)的方式, ...
图片预加载想必大家都不陌生吧,实现预加载图片有很多方法,包括使用CSS、JavaScript及两者的各种组合。这些技术可根据不同设计场景设计出相应的解决方案,十分高效
该演示的特点是我对进行了调整,该脚本是我在研究异步加载非常繁重的图形库的解决方案时发现的。 在addAsset ,您将能够像加载css或js文件一样,甚至影响应将其添加到何处。 看到的工作演示。 剧本 在addAsset ,...
近一年来,国内外都十分热衷于异步加载的研究,为了加快页面的载入速度,无阻塞加载Javascript的方法和框架成为了前端开发的焦点和亮点之一。
经过一番思考,到底怎么解决导包而且是异步的方式,最后得出一个解决方案。先来看一下采用这个方案后的编程方式
最近在做自己的小框架的按需加载模块,那么就需要做到异步动态加载css文件。仔细研究了一番,得到了如下解决方案,分享给大家。
对jQuery中的deferred的用法了一些了解,今天看到园子里的一篇文章:关于重构JS前端框架的失败经验(顺便怀念那些死去的代码),于是把我之前写的一个利用jQuery的deferred异步按顺序加载JS文件方案分享出来,欢迎...
android Gallery实现异步加载网络图片 并只加载当前停止页面图.zip Android ListView下拉刷新 Demo.zip Android SMS 短信内容显示在一个 泡泡 形状的窗口中.zip Android 打包签名 从生成keystore到完成签名.zip ...