From Gossip@caterpillar

Ajax Gossip: DOM Inspector

DOM Inspector是Mozilla Firefox的一個擴充套件，官方中文版上稱之為DOM觀察器，在安裝Mozilla Firefox時，可以在自訂安裝中選擇是否安裝DOM Inspector，如果在安裝Mozilla Firefox時沒有選擇自訂安裝以安裝DOM Inspector，則可以在 Mozilla 的 DOM Inspector 網址進行安裝。 Ajax應用程式中經常操作DOM Tree，您可以直接使用DOM Inspector來觀察DOM Tree中對應於網頁畫面的哪個元件，執行Mozilla Firefox官方中文版的「工具/DOM觀察器」，可以顯示DOM Inspector視窗，在網址列輸入網址，並按下「觀察」按鈕，即可開始觀察DOM與網頁的對應，對應的畫面會以紅色方框閃爍顯示。 如果您想要找尋特定的DOM節點，則可以執行「搜尋/尋找節點」，搜尋的方式可以有依「Id」、「Tag」或「Attr」等來進行搜尋。 在找到想觀察的節點後，可以在左邊的窗格觀察到該節點的各種屬性，預設是顯示JavaScript物件的各種屬性，例如可在下圖中，觀察到onmouseover與onmouseoout的事件處理者分別是getBookData()與clearData()： 例如可以切換至DOM Node的檢視模式，您也可以在某個屬性上按右鍵「編輯」，直接改變某個DOM的屬性值，像是改變src屬性： 您甚至可以選定一個DOM節點，在JavaScript檢視中，按右鍵「執行JavaScript」… 您還可以在 Introduction to the DOM Inspector 找到一些關於DOM Inspector的介紹。