js文件是异步加载,

js是在什么时候被加载执行的
 
动态引入的外部 JS 文件在各浏览器中的加载顺序不一致
 
 
 
1/ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件);比如一张图片只要<img>标签完成,不用等这个图片加载完成,就可以设置图片的宽高的属性或样式等;
 
 
 
2/onload,指示页面包含图片等文件在内的所有元素都加载完成。比如一张图片要等这个图标加载完成之后才能设置图片的宽高的属性或样式等;
 

支持该事件的 HTML 标签:

<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

支持该事件的 JavaScript 对象:

image, layer, window
1 第一种:window.onload = function(){}
2 第二种: window.onload = functionName; //注意:没有括号
1 <body onload="init();">

 
window.onload事件相比,ready()具有较高的执行优先级
 

3/document.onreadystatechange   当页面加载状态改变的时候执行这个方法。
 用法:

1 document.onreadystatechange = function(){  
2   if(document.readyState=="complete")  
3   {
4      window.open('http://www.aspbc.com'); //这里是你要做的事
5   }
6 }

onreadystatechange 事件通常用在基于 XMLHttpRequest 对象的 AJAX 应用中,当的该对象的 load state 改变时,会触发此事件。

但在 IE 中 onreadystatechange 事件是其私有实现的,用于数据加载的 IMG、SCRIPT 和 LINK 标记,常常被误用 onreadystatechange 事件而导致在非 IE 浏览器中无法得到预期结果。

造成的影响

onreadystatechange 事件处理在各浏览器支持不一致,可能会导非预期结果。

onreadystatechange 事件是微软对 IE 浏览器的私有事件扩充,所有元素都存在 onreadystatechange 事件。
下列元素对象总可以触发此事件,因为他们均会加载数据:APPLET,DOCUMENT,FRAME,FRAMESET,IFRAME,IMG,LINK,OBJECT,SCRIPT 和 XML 元素。
其他元素对象仅当 DHTML Behavior 被追加后会触发 onreadystatechange 事件。

 
 
解决方案

在现行 W3C 标准规范中仅有 XmlHttpRequest 对象中存在 onreadystatechange 事件 ( 请参考 XMLHttpRequest 规范 )。

对于其他元素或对象请慎用 onreadystatechange 事件,因为他只有 IE 浏览器支持,而 Opera 浏览器则只是部分支持。

 
 
 
 
 
 
 
 
 

加载顺序 ready onload onreadystatechange的更多相关文章

  1. 从一个例子了解window.onload、$(function(){})、$(window).load(function(){})的加载顺序

    最近遇到一个轮播需求: 1. ajax请求服务器,返回json,判断json数据里每一项中isFix属性是0还是1,0表示不轮播,1表示需要轮播. 2. 当isFix属性为0的时候,表示该图片不轮播, ...

  2. (转)JS加载顺序

    原文:http://blog.csdn.net/dannywj1371/article/details/7048076 JS加载顺序 做一名合格的前端开发工程师(12篇)——第一篇 Javascrip ...

  3. 关于html,css,js三者的加载顺序问题

    <head lang="en"> <meta charset="utf-8"> <title></title> ...

  4. 20180911 关于页面加载顺序引发的JS的undefined/null错误

    引用: 百度知道-HTML+JavaScript执行顺序问题 这是我在学习JS滚动播放图片案例意外遇到的一个问题,代码完成后console弹出错误警告: Uncaught TypeError: Can ...

  5. 前端 页面加载完成事件 - onload,五种写法

    在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$ ...

  6. javascript加载顺序

    javascript加载顺序 <script type="text/javascript" src="jquery.js"></script& ...

  7. 从html页面加载顺序来更好的理解jquery初始化

    一,html页面加载顺序 1,用户输入网址(假设是个html页面,并且是第一次访问),浏览器向服务器发出请求,服务器返回html文件:2,浏览器开始载入html代码,发现<head>标签内 ...

  8. ajax-json,遇到的一个问题,jquery var ,加载顺序。JS对象,json格式转换。

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. html页面的加载顺序

    页面加载顺序: 解析HTML结构加载外部脚本和样式表文件解析并执行脚本代码构造HTML DOM模型加载图片等外部文件页面加载完毕 window.onload = function () {  }  / ...

随机推荐

  1. html-解决乱码问题

    1.创建HTML时,需将文件编码设置为UTF-8: 2.需要在<head>元素下,借用<meta>元素设置内容的编码: 1)文件的编码:在webstorm中设置文件编码的问题: ...

  2. SHELL $RANDOM产生的随机数范围是0到32767

    1.使用系统的 $RANDOM 变量 fdipzone@ubuntu:~$ echo $RANDOM 17617 fdipzone@ubuntu:~$ echo $RANDOM 17617 $RAND ...

  3. Spring3.2.6 + hibernate4.2.8 + hibernate-generic-dao1.2.0

    n多方法都不成功,最后在hibernate-generic-dao官网上的例子hibernate-maven-web(使用其jar包及配置,并将hibernate更新为4.2.8,加入ehcache及 ...

  4. Spring MVC文本域

    以下示例显示如何在使用Spring Web MVC框架的表单中使用文本域(TextArea).首先使用Eclipse IDE来创建一个WEB工程,并按照以下步骤使用Spring Web Framewo ...

  5. Python Numpy ValueError: data type must provide an itemsize

    天朝网络锁国,百度找了半个小时找不出来原因,只能谷歌 谷歌第一条就是,顿时感觉幸福感来的太突然 原因是输入的矩阵均是字符串(从文件里读的) 那么就需要批量转数组,一行一行的转. 下面是我的代码: ro ...

  6. 椭圆参数方程中的θ(离心角Theta)

    椭圆参数方程中的离心角θ是交以其x轴对应外接圆上点的角度(或是交以其y轴对应内接圆上点的角度) 椭圆的参数程为:x=acosθy=bsinθ.M(x,y)椭圆上一点.过M作直线⊥X轴,交以O为圆心,以 ...

  7. Laravel5.1 模型--ModelFactory

    今天要说的是模型工厂,它是可以快速生成一些测试数据的东西,之前我们介绍过Seeder,当我们使用模型访问数据时 可以用模型工厂搭配Seeder使用. 1 编写一个ModelFactory ModelF ...

  8. SAE+wordpress邮箱问题,WP MAIL STMP插件配置但无效解决的方法

    我在SAE上面部署的WordPress是3.9版本号的,而非SAE应用商店里WordPress4sae是3.4的,虽然3.9版本号的确有非常多改进但在部署在SAE上面时须要做非常多改动,并且有些插件也 ...

  9. cocos2d-x:Layer::setPosition

    如果Node的实际类型是Layer或者其派生类, setPosition是不是有猫腻? std::string menuImage = "menu.png"; auto menuI ...

  10. Android开发:《Gradle Recipes for Android》阅读笔记(翻译)3.2——设置Flavors和Variants

    问题: 需要构建大体上一样,但是使用不同资源或者类的应用. 解决方案: 产品的flavors可以帮助你对同一个app创建不同的版本. 讨论: build types是开发过程的一部分,一般用来将app ...