zoukankan      html  css  js  c++  java
  • ready和load区别

    window的load事件会在页面中的一切都加载完毕才会触发。

    DOMContentLoaded 事件在形成DOM树就会触发,不理会图像、js、css等其他资源是否下载完毕。IE9+、FF、Chrome、Safari3.1、Opera 9+

    (1) 解析HTML结构。//ready
    (2) 加载外部脚本和样式表文件。
    (3) 解析并执行脚本代码。
    (4) 构造HTML DOM模型。
    (5) 加载图片等外部文件。
    (6) 页面加载完毕。//load

    附浏览器原理:

    渲染引擎首先通过网络获得所请求文档的内容,通常以8K分块的方式完成。

    下面是渲染引擎在取得内容之后的基本流程:

    解析html以构建dom树->构建render树->布局render树->绘制render树

    图2:渲染引擎基本流程

    渲染引擎开始解析html,并将标签转化为内容树中的dom节点。接着,它解析外部CSS文件及style标签中的样式信息。这些样式信息以及html中的可见性指令将被用来构建另一棵树——render树。

    Render树由一些包含有颜色和大小等属性的矩形组成,它们将被按照正确的顺序显示到屏幕上。

    Render树构建好了之后,将会执行布局过程,它将确定每个节点在屏幕上的确切坐标。再下一步就是绘制,即遍历render树,并使用UI后端层绘制每个节点。

    值得注意的是,这个过程是逐步完成的,为了更好的用户体验,渲染引擎将会尽可能早的将内容呈现到屏幕上,并不会等到所有的html都解析完成之后再去构建和布局render树。它是解析完一部分内容就显示一部分内容,同时,可能还在通过网络下载其余内容。

     http://www.cnblogs.com/haogj/archive/2013/01/15/2861950.html

  • 相关阅读:
    08-认识margin
    07-border(边框)
    06-padding(内边距)
    05-盒模型
    04-层叠性权重相同处理
    03-继承性和层叠性
    MySQL安装与基本管理
    数据库概述
    并发编程练习
    selectors模块
  • 原文地址:https://www.cnblogs.com/xjinza/p/3928381.html
Copyright © 2011-2022 走看看