ARIA:aria-rowcount 屬性

aria-rowcount 屬性定義了表格、網格或樹狀網格中的總行數。

描述

有些表格有數百行,甚至數百萬行。即使是行數較少的表格,僅載入一部分行也可能是一項設計要求,以提高效能或改善使用者體驗。當僅載入部分行時,您需要讓所有使用者知道當前顯示的是部分資料。aria-rowcount 屬性用於定義表格、網格或樹狀網格中的總行數。

將此屬性新增到 <table> 元素或角色為 table 的元素上,其值應為完整表格的行數(一個整數)。如果總行數未知,請包含 aria-rowcount="-1",這將告訴瀏覽器不要計算總行數。

如果所有行都已載入並在 DOM 中,則無需包含 aria-rowcount,因為瀏覽器會自動計算總行數。但是,如果所有行在任何時候都不全部存在於 DOM 中,則需要此屬性來提供已知完整表格大小的行數,並在總行數未知時告知瀏覽器不要自動計數。

示例

以下示例顯示了一個包含 24 行的網格,其中第一行以及第 7 行到第 9 行顯示給使用者。

html
<div role="grid" aria-rowcount="24">
  <div role="rowgroup">
    <div role="row" aria-rowindex="1">
      <span role="columnheader">First Name</span>
      <span role="columnheader">Last Name</span>
      <span role="columnheader">Position</span>
    </div>
  </div>
  <div role="rowgroup">
    <div role="row" aria-rowindex="7">
      <span role="gridcell">Morgan</span>
      <span role="gridcell">Brian</span>
      <span role="gridcell">Midfielder</span>
    </div>
    <div role="row" aria-rowindex="8">
      <span role="gridcell">Abby</span>
      <span role="gridcell">Dahlkemper</span>
      <span role="gridcell">Defender</span>
    </div>
    <div role="row" aria-rowindex="9">
      <span role="gridcell">Ashlyn</span>
      <span role="gridcell">Harris</span>
      <span role="gridcell">Goalkeeper</span>
    </div>
  </div>
</div>

<integer>

表格中的總行數,或在表格大小未知時為 -1

相關介面

Element.ariaRowCount

Element 介面的一部分 ariaRowCount 屬性,反映了 aria-rowcount 屬性的值。

ElementInternals.ariaRowCount

ElementInternals 介面的一部分 ariaRowCount 屬性,反映了 aria-rowcount 屬性的值。

相關角色

用於角色

繼承到角色

規範

規範
無障礙富網際網路應用程式 (WAI-ARIA)
# aria-rowcount

另見