动态加载JS过程中如何判断JS加载完成
在正常的加载过程中,js文件的加载是同步的,也就是说在js加载的过程中,浏览器会阻塞接下来的内容的解析。这时候,动态加载便显得尤为重要了,由于它是异步加载,因此,它可以在后台自动下载,并不会妨碍其它内容的正常解析,由此,便可以提高页面首次加载的速度。
那么,既然js是异步加载,我们又该如何判断它是否加载完成呢?
在IE或一些基于IE内核的浏览器中(如Maxthon),它是通过script节点的readystatechange方法来判断的,而其它的一些浏览器中,往往是通过load事件来决定的,如下代码:
- function dynamicLoad()
- {
- var _doc=document.getElementsByTagName('head')[0];
- var script=document.createElement('script');
- script.setAttribute('type','text/javascript');
- script.setAttribute('src','jquery-1.4.4.js');
- script.onload=script.onreadystatechange=function(){
- if(!this.readyState||this.readyState=='loaded'||this.readyState=='complete'){
- alert('done');
- }
- script.onload=script.onreadystatechange=null;
- }
- }
我们把该方法添加到body的load事件中,<body onload='dynamicLoad()'>,运行,会发现IE或Maxthon中,会弹出‘done’对话框,但是firefox或chrome中却完全没有反应,why?
这是因为,如果script节点没有添加到DOM树中,那么在chrome和firefox中是不会响应script的load事件的。但是IE中却可以。。修改后如下代码:
- function dynamicLoad()
- {
- var _doc=document.getElementsByTagName('head')[0];
- var script=document.createElement('script');
- script.setAttribute('type','text/javascript');
- script.setAttribute('src','jquery-1.4.4.js');
- _doc.appendChild(script);
- script.onload=script.onreadystatechange=function(){
- if(!this.readyState||this.readyState=='loaded'||this.readyState=='complete'){
- alert('done');
- }
- script.onload=script.onreadystatechange=null;
- }
- }
这时候,所有的浏览器都可以响应,你可以尝试一下~动态加载JS过程中如何判断JS加载完成
动态加载JS过程中如何判断JS加载完成的更多相关文章
- Js文件中调用其它Js函数的方法
在项目开发过程中,也许你会遇这样的情况.在某一Js文件中需要完成某一功能,但这一功能的大部分代码在另外一个Js文件中已经完成了,自己只需要调用这个方法再加上几句代码就可以实现所需的功能.我们知道,在h ...
- 加载dll过程中assembly失败
错误现象: 进行插件读取时出现错误:“尝试从一个网络位置加载程序集,在早期版本的 .NET Framework 中,这会导致对该程序集进行沙盒处理.此发行版的 .NET Framework 默认情况下 ...
- Sqoop import加载HBase过程中,遇到Permission denied: user=root, access=WRITE, inode="/user":hdfs:supergroup:drwxr-xr-x
在执行hbase sqoop抽取的时候,遇到了一个错误,如下图: 在执行程序的过程中,遇到权限问题很正常,也容易让人防不胜防,有问题就想办法解决,这个是关键. 解决办法如下: 第一步:su hdfs, ...
- 百度自动发贴,登录很顺利的模拟实现,但发贴攻关失败,能力有限,追JS过程中颇为痛苦
攻关失败,且短期内看不到希望,看不到方向,且越来越焦急,目前已知的是,用根据用户的鼠标事件以一定的规则结合其他数据,服务器以这些数据验证是否为真正的手动发贴. 不过闲暇时实现了百度贴吧的自动签到. 较 ...
- VS使用过程中,编写JS没有智能提示解决方法
问题:编写基本Script代码没有问题,但是在编写DOM代码时候没有智能提示.也就是在编写一般javascript代码时候没有问题,但是要写DOM代码的时候发现没有智能提示,如document等都需要 ...
- 全屏使用swiper.js过程中遇到的坑
概述 swiper.js确实是一个很好用的插件,下面记录下我在全屏使用过程中遇到的一些坑和解决办法,供以后开发时参考,相信对其他人也有用. 通用方案 一般来说,swiper需要放在body的下一层,虽 ...
- js:使用js过程中遇到的一个小问题
在一个作业中使用了js,函数A调用函数B.当A和B中均含有变量i的时候,相关操作结果可能会出错. 将B中的i替换为j(j不存在于A中)后,结果正确. 目前考虑原因是两个变量i有相关性(或者说实际上就是 ...
- 当前JS文件中加入其他js文件
注意:在html文件导入a.js时,应该把script></script写在/body>后面,否则 document.write()方法有问题. 在载入页面后,浏览器输出流自动关闭: ...
- js文件中引用其他js文件
这一个功能的作用是做自己的js包时,可以通过引入一个整体的js文件而引入其他js. 只需要在总体的js加上这一句话 document.write("<script type='text ...
随机推荐
- C51单片机内存优化
52本身有256B的数据存储区,如果没在意一些细节,很容易出现RAM超过128就报错的情况.现讲其问题解释如下: 最常见的是以下两种: ① 超过变量128后必须使用compact模式编译,实际的情况是 ...
- fuse 虚拟文件系统 的 安装与使用
FUSE 是个好东西, 可以用在特殊的领域里面来实现自己的虚拟文件系统. FUSE的下载与安装 : 从fuse官网下载最新安装包:http://sourceforge.net/projects/fus ...
- 深入浅出Node.js (4) - 异步编程
4.1 函数式编程 4.1.1 高阶函数 4.1.2 偏函数用法 4.2 异步编程的优势与难点 4.2.1 优势 4.2.2 难点 4.3 异步编程解决方案 4.3.1 事件发布/订阅模式 4.3.2 ...
- Spiral Matrix II 解答
Question Given an integer n, generate a square matrix filled with elements from 1 to n2 in spiral or ...
- 什么是野指针?(What is a wild pointer?)
未被初始化的变量称为野指针(wild pointer).顾名思义,我们不知道这个指针指向内存中的什么地址,使用不当程序会产生各种各样的问题. 理解下面的例子: int main() { int *p; ...
- JS中简单的this学习
我在学习JS初期,在使用this的时候经常出现问题,当然就是在现在,也有一些场景不能很好的明白this到底指代的是什么?看下面一个例子: var x = 10; var foo = { x ...
- python练习linux下创建路径
#coding=utf-8 import os class MakeDirectory(): def mkdir(self,path): # 去除首位空格 path=path.strip() # 去除 ...
- UIView 转 UIImage
这个方法很实用,特别是在做水印相机得时候... - (UIImage*) imageWithUIView:(UIView*) view{ // 创建一个bitmap的context // 并把它设置成 ...
- Html中value和name属性的作用
1.按钮中用的value 指的是按钮上要显示的文本 比如“确定”“删除”等 2.复选框用的value 指的是这个复选框的值 3.单选框用的value 和复选框一样 4.下拉菜单用的value 是列表 ...
- EffectiveC#9--明白几个相等运算之间的关系
1.当你创建你自己的类型时(不管是类还是结构),你要定义类型在什么情况下是相等的.C#提供了4个不同的方法来断定两个对象是否是相等的 public static bool ReferenceEqual ...