Skip to content

页面生命周期 ​

页面构建 ​

当 Web 应用能被展示或交互之前,其页面必须根据服务器获取的响应(通常是 HTML、CSS 和 JavaScript 代码)来构建。页面构建阶段的目标是建立 Web 应用的 UI,其主要包括两个步骤:

  1. 解析 HTML 代码并构建文档对象模型 (DOM);
  2. 执行 JavaScript 代码。

步骤 1 会在浏览器处理 HTML 节点的过程中执行,步骤二会在 HTML 解析到一种特殊节点——脚本节点(包含或引用 JavaScript 代码的节点)时执行。页面构建阶段中,这两个步骤会交替执行多次

HTML 解析和 DOM 构建 ​

通过解析收到的 HTML 代码,构建一个个 HTML 元素,构建 DOM。在这种对 HTML 结构化表示的形式中,每个 HTML 元素都被当作一个节点。

在页面构建阶段,浏览器会遇到特殊类型的 HTML 元素——脚本元素,该元素用于包括 JavaScript 代码。每当解析到脚本元素时,浏览器就会停止从 HTML 构建 DOM,并开始执行 JavaScript 代码。

执行 JavaScript 代码 ​

当浏览器在页面构建阶段遇到了脚本节点,它会停止 HTML 到 DOM 的构建,转而开始执行 JavaScript 代码,也就是执行包含在脚本元素的全局 JavaScript 代码 (以及由全局代码执行中调用的函数代码)。

大致区分出两种不同类型的 JavaScript 代码:全局代码和函数代码。

事件处理 ​