Firefox Add-ons DOM Tool

DOM Inspector
可以用來檢查和編輯任何 Web 文件或 XUL 應用程式的文件物件模型(DOM)。

DOM 使用兩個窗格的視窗導航，顯示文件內所有節點上的各種不同屬性。
Edit > Select Element by Click，然後切換到視窗點選要查看的元素，會有紅框，
再回 DOM Inspector 視窗就可看到該元素對應的節點以及屬性。

如果有安裝 Stylish 在 DOM Inspector 節點上點右鍵，
在 Copy 下面會多了個「複製選取的」子選單，
可以快速方便的複製及查找各種 CSS 的值。

查看 oncommand code 範例：
點選元素後回 DOM Inspector 視窗看，其 command 是 Tools:Addons
再用 Ctrl+F(Edit > Find Nodes) 尋找 Tools:Addons，
找到後發現其 oncommand="BrowserOpenAddonsMgr();"

DOM Inspector 導覽手冊：
http://crazylion.myweb.hinet.net/Introduction_to_the_DOM_Inspector/DI_zh_tw.html

　
Element Inspector
「Shift + 滑鼠右鍵」快速查看元素定位到 DOM Inspector 節點上。

該擴充套件為子功能需先安裝 DOM Inspector！
使用方法：在需要查看的元素上按「Shift + 滑鼠右鍵」，
將自動彈出 DOM Inspector 並定位到該元素上，
比內建的需要視窗切來切去快速許多 :)

　
Stacked Inspector
DOM Inspector 窗格上多一個按鈕可以切換為上下垂直佈局，
這可以更容易地閱讀長的值(如 CSS 規則)和導航深層嵌套的樹狀結構，
該擴充套件為 DOM Inspector 子功能。

　
keyconfig
重新裝訂你的熱鍵。

範例一：安裝 DOM Inspector 後，檢測工具的 Ctrl+Shift+I 被其搶去...(Alt+T+W+T)
再自訂回來：
name: 檢測 [網頁開發者], id: xxx_key1_檢測 [ç¶²é é–‹ç™¼è€…], shortcut: Ctrl+Shift+I, code:
InspectorUI.toggleInspectorUI();

範例二：Thunderbird 附加元件無快速鍵...(Alt+T+A)
設為跟 Firefox 一樣的 Ctrl+Shift+A，Thunderbird 已定義給主題，須先改掉，
用 DOM Inspector 查得其 oncommand="openAddonsMgr();"
與 Firefox 的 oncommand="BrowserOpenAddonsMgr();" 不同...
name: 附加元件, id: xxx_key1_é™„åŠ å…ƒä»¶, shortcut: Ctrl+Shift+A, code:
openAddonsMgr();

範例三：選單列...(Alt+V+T+M)
name: 選單列, id: xxx_key2_選單列, shortcut: Alt+M, code:
var toolbar=document.getElementById("toolbar-menubar");setToolbarVisibility(toolbar,toolbar.getAttribute("autohide")=="true")

　
Stylish(新增完開啟網頁)
為了可以在 DOM Inspector 快速方便的複製及查找各種 CSS 的值。
詳細說明見：散人的備忘錄: Firefox Add-ons 其他額外功能的附加元件-2

有些元素沒有 id，沒有 class，隱藏元素的寫法可以很多元，例：
[css]/*用它上層選單項的 id 或 class 來隱藏*/
#appmenu_bookmarksPopup>menuseparator:nth-child(2){display:none}
/*用它上個選單項的 id 或 class 來隱藏*/
#appmenu_showAllBookmarks+menuseparator{display:none}
/*用它上個選單項的 label 來隱藏*/
menuitem[label="顯示所有書籤"]+menuseparator{display:none}[/css]

移動元素排列順序，例：
在同個層級，可以使用 -moz-box-ordinal-group:2 來指定順序。