瀏覽器工作原理（四） 瀏覽器事件解讀

參考：

事件監聽的三種方式：

1、html內聯屬性：

2、dom屬性繫結：document.getelementbyid("btn").onclick = function () {}

3、事件監聽函式：document.getelementbyid("btn").addeventlistener("click", ()=>{}, false)

function

addeventhandler(obj, eventname, handler) 
else
if(document.attachevent)     
else
}

2、document.getelementbyid("btn").detachevent("onclick")

3、document.getelementbyid("btn").onclick = null

function

removeeventhandler(obj, eventname, handler) 
else
if(document.detachevent) 
else
}

1、捕獲階段：使用者對 dom 元素進行操作，從 window 依次經過 docuemnt、html、body等，到達目標元素父節點的過程稱為捕獲階段，注意此時還未到達目標節點。

2、目標階段：捕獲階段結束，事件到達目標元素並觸發事件的過程是目標階段

3、冒泡階段：目標元素觸發事件結束後，向父元素逐級返回的過程

事件委託是指，某元素的事件自己不處理，而是借助事件冒泡原理交由目標元素的父級或祖級元素處理的機制。例如，li列表事件可以繫結到ul，radio列表事件可以繫結在父級元素

1、為什麼要事件委託

減少時間繫結，提公升效能（事件繫結會占用記憶體）

動態監聽，避免增加或刪除元素導致的事件繫結

2、流程

事件到達目標元素後，冒泡返回，被已繫結事件的父級或祖級元素響應執行。其中，事件物件中的 target 屬性記錄實際觸發本次事件的元素

在不希望事件冒泡的時候可以阻止該機制

function

preventbubble(e) 
e.cancelbubble = true
;    
if(e.stoppropagation) 
}

瀏覽器工作原理

首先對上篇blog 進行乙個補充 以我做的 基於執行緒池和資料庫連線池的web 伺服器 為例，說說http 通訊的流程，大體分為三個階段 a 連線 伺服器通過乙個serversocket 類物件對8000 埠進行監聽，監聽到之後建立 連線，開啟乙個socket 虛擬檔案。b 請求 建立與建立sock...

瀏覽器工作原理

介紹 渲染引擎又叫排版引擎或者瀏覽器核心 主流的渲染引擎有 解析html構造dom樹 document object model，文件物件模型 dom是w3c組織推薦的處理可擴充套件置標語言的標準程式設計介面。構建渲染數，渲染數並不等同於dom數，因為像head標籤或者display none這樣的...

瀏覽器工作原理

輸入網域名稱，瀏覽器做簡單的篩選判斷 預設為http協議，https的話需要手動輸入 dns查詢，獲取ip位址 先查自己記憶體裡的dns cache 再查本地硬碟裡的host檔案 查詢dns服務 建立tcp ip連線 傳送http請求 伺服器處理 瀏覽器收到返回，解析展示 我們在瀏覽器輸入 其實就是...