使用 [協助工具] 索引標籤測試協助工具

「 協助工具」 索引標籤是您檢視 DOM 節點的協助工具樹狀結構、ARIA 屬性和計算的協助工具屬性的位置。

若要開啟 [協助工具 ] 索引標籤:

  1. 在轉譯的網頁中,以滑鼠右鍵按一下元素,然後選取 [檢查]。

    DevTools 隨即開啟,並選取 [元素] 工具。 DOM 樹狀結構隨即開啟,以顯示您以滑鼠右鍵按一下的元素。

  2. 在 DOM 樹狀目錄中,按一下您要檢查的元素。 您可以使用方向鍵在 DOM 樹狀結構中移動。

  3. 按一下 [樣式] 索引標籤右側的 [協助工具] 索引標籤。您可能需要先按一下 [其他索引標籤] ([樣式] 索引標籤右側的 [其他索引標籤] 按鈕) 按鈕。

[元素] 工具提要欄位面板中的 [協助工具] 索引標籤

檢視元素在協助工具樹狀目錄中的位置

協助工具樹是 DOM 樹的子集。 協助工具樹狀結構只包含 DOM 樹狀結構中對於透過螢幕助讀程式等輔助技術顯示頁面內容相關且有用的元素。

從 [協助工具 ] 索引標籤中檢查協助工具樹狀中的元素位置。

協助工具樹狀結構章節

檢視元素的 ARIA 屬性

ARIA 屬性可確保螢幕助讀程式等輔助技術具備正確呈現頁面內容所需的所有資訊。

在 [ 協助工具 ] 索引標籤中檢視元素的 ARIA 屬性。

ARIA 屬性區段

檢視元素的計算協助工具屬性

部分協助工具屬性是由瀏覽器動態計算。 這些屬性會顯示在 [協助工具] 索引標籤的 [計算屬性] 區段中。

在 [協助工具 ] 索引標籤中檢視元素的計算協助工具屬性。

[協助工具] 索引標籤的 [計算屬性] 區段

計算的協助工具屬性與計算的 CSS 屬性不同。 若要深入了解如何檢視計算的 CSS 屬性,請參閱在 CSS 功能參考中僅檢視實際套用至元素的 CSS。

注意事項

本頁面的部分內容是根據 Google 建立和分享 的作品進行修改,並根據知識 共享署名 4.0 國際授權條款中所述的條款使用。 原始頁面可在 此處 找到,由 Kayce Basques 撰寫。

Creative Commons 授權 本作品已根據 知識共享署名 4.0 國際許可證獲得許可。