前言：我們一直在用瀏覽器，你是否真正玩過他？no！
在ie瀏覽器中，開啟乙個網頁，右擊選單欄中有乙個檢視源**功能，不過這個源**太長了，不易分析。
之後的瀏覽器增加了一項功能，叫做審查元素功能。
在谷歌瀏覽器中，開啟乙個網頁，右擊選單欄中有一項是檢查；在搜狗瀏覽器中，開啟乙個網頁，右擊選單欄有一項是審查元素；其他瀏覽器筆者未嘗試過。
一、審查元素簡介
右側出現審查元素介面，也就是網頁的
html
**元素
其中包括以下模組
elements(元素
/標籤
)：檢視頁面中所有的
html
元素，左面是用樹形結構展示的
html
標籤，滑鼠移到上面會在頁面中顯示這個標籤的位置、實際長寬等。右面是每個元素的
css屬性，繼承關係等等，還有
dom屬性、繼承關係、繫結的事件。
resource(資源
)：顯示頁面中用到的所有資源，頁面、、樣式表、指令碼等。還有本地儲存、
cookie.
network(網路
)：顯示所有的網路事件，你需要先開啟開發人員工具，切換到這個選項卡，之後再重新整理頁面才會有顯示。
這裡會顯示每個檔案的資訊、由何處觸發這個網路活動、
報頭等等
.sources(源**
)：用於對js
進行除錯，左面有所有
js**的列表，中間是**區域
(下面有個格式化**的功能
)，右邊是斷點、觸發器、呼叫棧等等
.timeline(時間軸
)：同樣需要先開啟這個選項卡，點選下面的
`開始捕捉
`才會有顯示。
這個選項卡會顯示頁面中的一切時間，包括執行指令碼、網路活動、頁面渲染等等。
而且會很詳細的顯示每個活動占用的
cpu和記憶體
.可以利用這些資訊對網頁進行優化
.profiles(報告
)：可以擷取一段時間的
cpu使用情況報告、
css類使用情況報告
(用來剔除未用到的
css)
、堆記憶體快照
(用於優化
js指令碼和
dom結構
).audits(審計
)：讓chrome
給你的網頁提出一點建議，一般是關於哪些**不必要、沒用到
.console(控制台
)：這是乙個
js控制台，你可以直接執行
js**，對頁面進行操作
.二、利用審查元素修改網頁
元素標籤上展示了網頁上元素的
html
原始碼，隨著你的滑鼠在**上移動，左側會顯示你所指向的元素控制項。
最基本的是head乙個網頁的總設定，如下所示
title
設定標題。
可以修改其中的文字改變標題。
body是整個網頁的布局。
左圖所示，為右上角選單欄的**，其中我們可以設定的選單：糯公尺、新聞、地圖等。並且分別對應著乙個連線，我們可以對其修改。
例如下圖所示：
注意：此種修改只能在本地修改，當然修改不了**本身。
resource（資源）
network
檢視當前執行的網路事件，下面有列表，點選
sizeinitiator（即發起程式，即資源的**位址）如圖2
所示，有很多斷點，可以快取完第一段後點到第二段，然後他就就快取第二段了，再點到第三段，就快取第三段了。
四、網頁程式設計學習
網頁的幕後都被我們看到了，我們也可以利用它做一些小外掛程式，比如賬號自動登入的外掛程式，我們知道網頁中的元素，也就知道本身這些元素的
id號就可以通過程式去填充它，一些迅雷會員破解等內容的實現也是基於此的，利用軟體網頁控制項的
id號來去操作它。
下面是一篇介紹自動登入外掛程式製作的思路。
文章格式整理不太好可以參照word版本
寄語：**的力量是偉大的，要有一顆善於發現的眼睛，世界才會被你掌握，極客的思想。
谷歌瀏覽器的原始碼分析 8
上一次說到處理wm char訊息，當使用者每鍵入乙個字元時，萬能連線框就會去進行一次查詢的過程，然後把智慧型提示資訊顯示出來。說到autocompleteedit handlekeystroke函式的操作，那麼它為什麼需要凍結這個函式的使用呢？現在就來分析這部份的內容。如下 scopedfreeze...
谷歌瀏覽器的原始碼分析 30
上次說到函式winhttpreaddata 通過上面的函式可以看到，當資料接收完成後，就會呼叫docallback函式處理接收到的資料。docallback函式的 如下 看到這裡又是乙個 函式c run的通知，它是呼叫開始建立這個連線時設定的 物件。如果是http請求，那麼這個請求 函式是物件url...
谷歌瀏覽器的原始碼分析 32
上一次說到在類resourcedispatcher會收到接收http資料訊息，並進一步處理資料。那麼resourcedispatcher類又把接收到的資料發往何處呢？這是需要我們去搞懂它的。通過進一步的跟蹤，會發現在resourcedispatcher onreceiveddata函式呼叫webco...