Javascript加载执行顺序
本文主要内容
一、不同位置的script标签执行顺序
二、document.ready和window.onload的区别
一、不同位置的script标签执行顺序
整个加载的过程从解析头部开始，比如html编码格式，meta标签等。当浏览器加载html文件并解析到<head>时,页面也就是<body>并没有被解析,浏览器会等到<head>中的js执行完再加载页面。
比如直接在head的script标签里面写$('#AD').css("display","none");，解析完head就执行了。Id为AD的元素就不会在页面中显示。
head和头部引进的script脚本最先加载并执行，处于body中的元素是在页面加载到他的位置时候进行执行。而onload是最后执行的。
假如说你把DOM操作放在了<head>标签里，你会发现报错，这是因为DOM树还没建立，getElementById获取的是undefined。所以说最好把<script>放在</body>之前。
二、document.ready和window.onload的区别
在Jquery里面，我们可以看到两种写法:$(function(){})和$(document).ready(function(){})。这两个方法的效果都是一样的，都是在dom文档树加载完之后执行一个函数（注意，这里面的文档树加载完不代表全部文件加载完）。
而window.onload是在dom文档树加载完和所有文件加载完之后执行一个函数。也就是说$(document).ready要比window.onload先执行。
Jquery里面$(document).ready函数的内部结构：
document.ready = function (callback) {
///兼容FF,Google
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', function () {
document.removeEventListener('DOMContentLoaded', arguments.callee, false);
callback();
}, false)
}
//兼容IE
else if (document.attachEvent) {
document.attachEvent('onreadystatechange', function () {
if (document.readyState == "complete") {
document.detachEvent("onreadystatechange", arguments.callee);
callback();
}
})
}
else if (document.lastChild == document.body) {
callback();
}
}
Javascript加载执行顺序的更多相关文章
- MySQL逻辑架构、SQL加载执行顺序、七种JOIN模式图解
逻辑架构 存储引擎 查看当前安装的mysql提供的存储引擎 查看当前mysql默认的存储引擎 MyISAM和InnoDB SQL加载执行顺序 sql书写顺序 mysql解析器执行的顺序 考点:m ...
- Javascript加载执行问题探索
转自:http://www.cnblogs.com/huangxincheng/archive/2011/12/04/2275988.html 前言 最近研究MongoDB数据库,无意间发现的好博客, ...
- js在html中的加载执行顺序
1.加载顺序:引入标记<script />的出现顺序,依次加载 页面上的Javascript代码是HTML文档的一部分,所以Javascript在页面装载时执行的顺序就是其引入标记< ...
- js文件加载执行顺序
转自:http://blog.163.com/water_down/blog/static/170276590201111711243458/ <script type="text/j ...
- html css javascript 加载的顺序
html /css /javascript 这三者的加载顺序影响整个页面的加载速度.而加载速度的快慢直接影响pv(访问量),而且会影响经济收入.在大网站中,可能打开速度快一秒,一年能多带来上亿的收入. ...
- html 和 javascript 的相关执行顺序
1.dom 树和 js 的加载顺序 http://blog.csdn.net/jdsxzhao/article/details/44646463 2. jquery中各个事件执行顺序如下: https ...
- js的并行加载与顺序执行
javaScript文件(下面简称脚本文件)需要被HTML文件引用才能在浏览器中运行.在HTML文件中可以通过不同的方式来引用脚本文件,我们需要关注的是,这些方式的具体实现和这些方式可能会带来的性能问 ...
- javascript加载顺序
javascript加载顺序 <script type="text/javascript" src="jquery.js"></script& ...
- 使用async属性异步加载执行JavaScript
HTML5让我兴奋的一个最大的原因是,它里面实现的新功能和新特征都是我们长久以来一直期待的.比如,我以前一直在使用placeholders,但以前必须要用JavaScript实现.而HTML5里给Ja ...
随机推荐
- 论.net平台的切身感触(惑)
这篇博客只是作者客观看法,不喜勿喷,条条大路通罗马,路不同风景也不一样,接下来的路该怎么走? 简介:作者.net程序员一枚,工作已有四年,接触过.net平台winform,webform,mvc的开发 ...
- AFNetworking 内部详解
AFNetworking 是一个适用于IOS 和 Mac OSX 两个平台的网络库,他是在Foundation URL Loading System 基础上进行的一套封装 ,并提供了丰富的API接口 ...
- Android -- 带你从源码角度领悟Dagger2入门到放弃（二）
1,接着我们上一篇继续介绍,在上一篇我们介绍了简单的@Inject和@Component的结合使用,现在我们继续以老师和学生的例子,我们知道学生上课的时候都会有书籍来辅助听课,先来看看我们之前的Stu ...
- Fibonacci 数列O(logn)解法
传统解法 提到斐波那契数列(Fibonacci Sequence),首先想到的是经典的动规(DP)算法. 时间复杂度O(n),这里空间复杂度可以优化到O(1).代码如下: int fib_n(int ...
- UPS对电源故障的处理能力
UPS对电源故障的处理能力 双变换在线式UPS由于其逆变器实时在线工作,因而能对所有的电源故障具有隔离和处理功能.由于目前电网情况发生了很大变化,真正的长时间断电只占所有电源故障的30%甚至更低,而非 ...
- 烧录口被初始化为普通IO
烧录口被初始化为普通IO后如果复位端没有的烧录口会导致不能识别烧录器不能下载与调试,因为程序一开始就把端口初始化了,烧录器不能识别,添加复位端口到烧录器(前提是你的烧录器有复位端). 有了复位段之后, ...
- MongoDB基础教程系列--第九篇 MongoDB 分片
1.分片介绍 分片(sharding)是将数据拆分,将其分散存到不同机器上的过程.MongoDB 支持自动分片,可以使数据库架构对应用程序不可见.对于应用程序来说,好像始终在使用一个单机的 Mongo ...
- Spring多种加载Bean方式简析
1 定义bean的方式 常见的定义Bean的方式有: 通过xml的方式,例如: <bean id="dictionaryRelMap" class="java.ut ...
- [进程管理] Linux中Load average的理解
Load average的定义 系统平均负载被定义为在特定时间间隔内运行队列中的平均进程树.如果一个进程满足以下条件则其就会位于运行队列中: - 它没有在等待I/O操作的结果 - 它没有主动进入等待状 ...
- 关于div+css布局值得注意的地方
注意项 我们知道,如果想要两个 div(即块级元素)挨着一起排列,可以将其设置为inline-block(行内-块元素). 不过要注意两个div内的内容的对齐方式将是垂直中间对齐,所以这时候就需要使用 ...