web页面的加载顺序
1.页面顺序
一个典型的web页面由于三个部分组成:html、css和JS。执行的顺序是:

在构造完HTML的dom结构时。触发DOMContentLoaded事件。
整个执行过程安装html的顺序来执行。
html->head->title->style->加载样式->解析样式->link->加载外部样式表->解析外部样式->script->加载外部脚本->解析外部脚本->执行外部脚本->body->div->body->div->加载脚本->解析脚本->执行脚本->img->script->加载脚本->解析脚本->执行脚本->加载外部图片文件->页面初始化完毕。
2.js解析顺序
JS解析过程分为编译和执行两个过程,编译也叫预处理,JS解析器完成JS代码的预处理,使JS脚本代码转换成字节码。
执行期间,JS解析器借助执行期环境将字节码生成机器码,并按照顺序执行。
整个JS解析过程:

其中,词法分析器和语法分析器是交错进行的。通常,每取一个词法记号,就将其送入语法分析器进行分析。
在JS解析过程中需要关注两个方面的问题。
2.1 词法作用域
JS的变量和函数作用域采用的是词法作用域,也就是说,JS的作用域在词法分析器的阶段就决定了,而不是在执行期间决定的,即作用域取决于原代码。
2.2 调用对象和作用域链接
函数执行过程,首页创建一个执行环境,在这个环境中创建一个调用对象。 调用对象保存函数所执行的局部变量,参数、嵌套函数、外部引用等等。
作用域链接是把多个嵌套函数的作用域连在一起,再这个过程中就有可能会有闭包,也有可能产生内存泄漏。
@7X%ZOEE}$J85DT1H[%1.png)
web页面的加载顺序的更多相关文章
- web.xml组件加载顺序
在配置项目组件的过程中, 了解Tomcat加载组件顺序很有必要. 例如某些框架如Quartz的集群功能需要数据库的支持, 数据库的加载肯定要在框架组件加载之前. 经过查阅和Debug发现, web.x ...
- web相关文件加载顺序
WEB相关文件的加载顺序 一. 1.启动一个WEB项目,WEB容器会先去读取它的配置文件web.xml,读取<context-param>和<listener>两个节点. ...
- web.xml文件加载顺序
1.启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<listener>和<context-param>两个结点. 2.紧急着,容创建一个Servl ...
- web.xml 配置 加载顺序
web.xml 的加载顺序是:context-param -> listener -> filter -> servlet . 过滤器执行顺序是根据filter-mapping ,不 ...
- java web项目启动加载顺序
转载:https://www.cnblogs.com/writeLessDoMore/p/6935524.html web.xml加载过程(步骤): 1.启动WEB项目的时候,容器(如:T ...
- web工程中web.xml元素加载顺序以及配置实例
简介 web.xml是web工程的配置文件,容器加载web工程时,会首先从WEB-INF中查询web.xml,并加载其中的配置信息,可以将web.xml认为是web工程的入口. web.xml中包含有 ...
- Asp.Net页面(母版页)加载顺序
ASP.NET 母版页和内容页中的事件 母版页和内容页都可以包含控件的事件处理程序.对于控件而言,事件是在本地处理的,即内容页中的控件在内容页中引发事件,母版页中的控件在母版页中引发事件.控件事件不会 ...
- html页面元素加载顺序
一般来说,添加背景图片有三种办法: 直接写在标签的style里面,如: <div style="background-image:url('images/Css.JPG')" ...
- jquery的 $(function(){ }) = $(document).ready(function(){ }) ,及页面的加载顺序
document.ready和onload的区别:一.JavaScript文档加载完成事件页面加载完成有两种事件一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件) 二.是onloa ...
随机推荐
- 了解ASP.NET MVC几种ActionResult的本质:JavaScriptResult & JsonResult
在之前的两篇文章(<EmptyResult & ContentResult>和<FileResult>)我们剖析了EmptyResult.ContentResult和F ...
- iOS开发小技巧--即时通讯项目:消息发送框(UITextView)高度的变化; 以及UITextView光标复位的小技巧
1.即时通讯项目中输入框(UITextView)跟随输入文字的增多,高度变化的实现 最主要的方法就是监听UITextView的文字变化的方法- (void)textViewDidChange:(UIT ...
- struts2的核心和工作原理
struts2的核心和工作原理 设计目标 Struts设计的第一目标就是使MVC模式应用于web程序设计.技术优势 Struts2有两方面的技术优势,一是所有的Struts2应用程序都是基于clien ...
- Linux_虚拟机_安装VMware Tools
以root用户执行,否则可能会出现权限不足,无法执行的情况 一.点击安装Vmware Tools 二.拖动安装文件到桌面并解压 三.双击并[在终端中运行] 四.根据提示回车或输入yes ...
- unittest测试驱动之HTMLTestRunner.py
对于自动化来说,测试报告是必须的,在敏捷化的团队中,团队中的成员需要自动化这边提供自动化的测试报告,来判断系统的整体质量以及下一步的测试策略.单元测试库生成测试输出到控制台的窗口上,但是这样的结果看起 ...
- XAML: x:DeferLoadStrategy, x:Null
x:DeferLoadStrategy="Lazy" - 用于指定一个 UIElement 为一个延迟加载元素 x:Null - null 示例1.x:DeferLoadStrat ...
- Spring10种常见异常解决方法
在程序员生涯当中,提到最多的应该就是SSH三大框架了.作为第一大框架的Spring框架,我们经常使用. 然而在使用过程中,遇到过很多的常见异常,我在这里总结一下,大家共勉. 一.找不到配置文件的异常 ...
- 如何更改IP地址的映射名字
windows系统下: 在C:\Windows\System32\drivers\etc\hosts里面添加你想对应的域名 如192.168.230.134 weekend110 注意:这要有管理员权 ...
- iOS推送处理
iOS收到推送后,跳转到某一页面 字数1348 阅读1001 评论4 喜欢26 以前做过推送, 但只是那种最基本的广播推送(向所有安装appde设备通知), 列播组播这种对指定用户推送消息还没做过, ...
- Java多线程与并发库高级应用-传统线程互斥技术
线程安全问题: 多个线程操作同一份数据的时候,有可能会出现线程安全问题.可以用银行转账来解释. 模拟线程安全问题 /** * 启动两个线程分别打印两个名字,名字按照字符一个一个打印 * * @aut ...