Movatterモバイル変換


[0]ホーム

URL:


  1. Web
  2. Barrierefreiheit
  3. ARIA
  4. ARIA-Referenz
  5. Attributes
  6. aria-colindex

Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.

View in EnglishAlways switch to English

ARIA: aria-colindex Attribut

Dasaria-colindex Attribut definiert den Spaltenindex oder die Position eines Elements in Bezug auf die Gesamtzahl der Spalten innerhalb einestable,grid odertreegrid.

Beschreibung

Einige Tabellen sind sehr groß und zeigen daher zunächst nur einen Teil ihres Inhalts an. Während das Laden nur eines Unterabschnitts der Spalten die Benutzererfahrung verbessern kann, müssen Sie alle Benutzer darüber informieren, welche Teile des Inhalts angezeigt werden und dass nicht der gesamte Inhalt der Tabelle vorhanden ist.

ARIA stellt mehrere Attribute bereit, um Informationen übertable,grid undtreegrid Strukturen bereitzustellen. Dasaria-colindex Attribut definiert die Substruktur, sprich den Spaltenindex oder die Position eines Elements in Bezug auf die Gesamtzahl der Spalten innerhalb solcher Strukturen.

In Verbindung mit demaria-colcount Attribut, das unterstützende Technologien darüber informiert, wie viele Spalten die Tabelle hätte, wenn alle Spalten vorhanden wären, wirdaria-colindex verwendet, um den Spaltenindex oder die Position eines Elements mit Bezug auf diese Gesamtzahl der Spalten anzugeben.

Wenn alle Spalten im DOM vorhanden sind, istaria-colindex nicht erforderlich, da Benutzeragenten den Spaltenindex jeder Zelle oder Gitterzelle berechnen können. Wenn jedoch zu irgendeinem Zeitpunkt Spalten aus dem DOM weggelassen werden, verwenden Siearia-colindex, um die Spalte jeder Zelle oder Gitterzelle in Bezug auf die vollständige Tabelle anzugeben.

Der Wert füraria-colindex ist eine ganze Zahl, die größer oder gleich 1 ist. Jeder Wert sollte größer als der vorherigearia-colindex der Spalte und kleiner oder gleich der Anzahl der Spalten in der vollständigen Tabelle sein.

Wenn eine Zelle oder Gitterzelle mehrere Spalten überspannt, setzen Siearia-colspan auf die Anzahl der Spalten, die sie überspannt, falls nicht die HTML-Elemente<td> und<th> verwendet werden, und setzen Siearia-colindex auf den Wert des Anfangs der Überlappung; den Wert, den es hätte, wenn es nur eine Spalte breit wäre und nur die erste seiner Spalten überspannt würde.

Wenn der Satz von Spalten, die im DOM vorhanden sind, zusammenhängend ist und wenn es in diesem Satz keine Zellen gibt, die mehr als eine Zeile oder Spalte überspannen, müssen Siearia-colindex nur einmal in jeder Zeile in der ersten Spalte des Satzes setzen. Wenn die Spalten nicht zusammenhängend sind, schließen Sie denaria-colindex Wert für alle untergeordneten oder besessenen Elemente jeder Zeile ein.

Das folgende Beispiel zeigt ein Gitter mit 6 Spalten, von denen die Spalten 1, 2, 5 und 6 dem Benutzer angezeigt werden. Die Gesamtzahl der Spalten, die die Tabelle bildet, ist mitaria-colcount="6" an der Tabelle selbst gesetzt. Da die Spalten nicht zusammenhängend sind, haben jedescell - in diesem Fallcolumnheader undgridcell Elemente - dasaria-colindex Attribut gesetzt.

html
<div role="grid" aria-colcount="6">  <div role="rowgroup">    <div role="row">      <div role="columnheader" aria-colindex="1">First name</div>      <div role="columnheader" aria-colindex="2">Last name</div>      <div role="columnheader" aria-colindex="5">City</div>      <div role="columnheader" aria-colindex="6">Zip</div>    </div>  </div>  <div role="rowgroup">    <div role="row">      <div role="gridcell" aria-colindex="1">Debra</div>      <div role="gridcell" aria-colindex="2">Burks</div>      <div role="gridcell" aria-colindex="5">New York</div>      <div role="gridcell" aria-colindex="6">14127</div>    </div>  </div>  …</div>

Die erste Regel der ARIA Verwendung ist: "Wenn Sie eine native Funktion mit den erforderlichen Semantik- und Verhaltensweisen verwenden können, anstatt ein Element zu zweckentfremden undeine ARIA-Rolle, -Zustand oder -Eigenschaft hinzuzufügen, um es zugänglich zu machen, dann tun Sie dies." Wenn wir native HTML-Semantik mit<table>,<th>,<td>, etc. verwenden und nur einen Unterabschnitt von Spalten anzeigen, sind die Attributearia-colcount undaria-colindex weiterhin notwendig, aber das Markup ist nicht so umfangreich.

Wenn semantische Tabelllenkopf-Elemente verwendet werden und nicht alle Spalten im DOM sind, muss dasaria-colindex Attribut nur einmal pro Spalte im Spaltenkopf<th> definiert werden.

html
<table aria-colcount="6">  <thead>    <tr>      <th aria-colindex="1" scope="col">First name</th>      <th aria-colindex="2" scope="col">Last name</th>      <th aria-colindex="5" scope="col">City</th>      <th aria-colindex="6" scope="col">Zip</th>    </tr>  </thead>  <tbody>    <tr>      <td>Debra</td>      <td>Burks</td>      <td>New York</td>      <td>14127</td>    </tr>    …  </tbody></table>

Wenn alle Spalten im DOM vorhanden sind, sind wederaria-colcount nocharia-colindex notwendig.

Werte

<integer>

Eine ganze Zahl, die größer oder gleich 1 und kleiner oder gleich der Gesamtzahl der Spalten ist, wenn alle vorhanden wären.

Zugehörige Schnittstellen

Element.ariaColIndex

DieariaColIndex Eigenschaft, Teil derElement Schnittstelle, spiegelt den Wert desaria-colindex Attributs wider.

ElementInternals.ariaColIndex

DieariaColIndex Eigenschaft, Teil derElementInternals Schnittstelle, spiegelt den Wert desaria-colindex Attributs wider.

Zugehörige Rollen

Verwendet in Rollen:

Vererbt in Rollen:

Spezifikationen

Specification
Accessible Rich Internet Applications (WAI-ARIA)
# aria-colindex

Siehe auch

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

[8]ページ先頭

©2009-2025 Movatter.jp