瀏覽器渲染頁面的一般過程：
1.瀏覽器解析html源碼，然后創建一個 DOM樹。並行請求 css/image/js在DOM樹中，每一個HTML標簽都有一個對應的節點，並且每一個文本也都會有一個對應的文本節點。DOM樹的根節點就是 documentElement，對應的是html標簽。
2.瀏覽器解析CSS代碼，計算出最終的樣式數據。構建CSSOM樹。對CSS代碼中非法的語法它會直接忽略掉。解析CSS的時候會按照如下順序來定義優先級：瀏覽器默認設置 < 用戶設置 < 外鏈樣式 < 內聯樣式 < html中的style。
3.DOM Tree + CSSOM --> 渲染樹（rendering tree）。渲染樹和DOM樹有點像，但是是有區別的。
DOM樹完全和html標簽一一對應，但是渲染樹會忽略掉不需要渲染的元素，比如head、display:none的元素等。而且一大段文本中的每一個行在渲染樹中都是獨立的一個節點。渲染樹中的每一個節點都存儲有對應的css屬性。
4.一旦渲染樹創建好了，瀏覽器就可以根據渲染樹直接把頁面繪制到屏幕上。
以上四個步驟並不是一次性順序完成的。如果DOM或者CSSOM被修改，以上過程會被重復執行。實際上，CSS和JavaScript往往會多次修改DOM或者CSSOM。