HTMLTableSectionElement.chOff — Eigenschaft · JavaScript-Referenz

Signatur

HTMLTableSectionElement.chOff

Beschreibung

chOff ist eine Eigenschaft der Schnittstelle HTMLTableSectionElement. Sie entspricht dem Inhaltsattribut charoff der Tabellenabschnitte <thead>, <tbody> und <tfoot>. Wer die Eigenschaft liest, erhält den Attributwert als Zeichenkette. Wer sie setzt, schreibt diesen Wert in das Attribut zurück.

Ursprünglich war sie für die Ausrichtung an einem bestimmten Zeichen gedacht, zum Beispiel am Dezimalkomma. Zusammen mit align="char" und ch (Attribut char) sollte charoff angeben, um wie viele Zeichen der Inhalt gegenüber diesem Ausrichtungszeichen verschoben wird. Kein Browser hat diese Ausrichtung je umgesetzt. Die Eigenschaft ändert also nichts an der Darstellung.

Sinnvoll ist chOff heute höchstens, um alte HTML-Dokumente zu untersuchen oder zu bereinigen. In neuem Code sollte man sie nicht verwenden. Zum Ausrichten von Zellinhalten nimmt man CSS, etwa text-align auf den Zellen. Für die Ausrichtung am Dezimalzeichen eignen sich font-variant-numeric: tabular-nums und rechtsbündiger Text.

Rückgabewert

Typ

string

Beschreibung

Der Wert des Attributs charoff. Fehlt das Attribut, ist es eine leere Zeichenkette "". Der Wert wird unverändert gespiegelt, auch wenn er keine gültige Zahl ist.

Beispiele

Wert des Attributs charoff auslesen

// HTML: <table><tbody id="preise" charoff="2"><tr><td>12,50</td></tr></tbody></table>
const tbody = document.getElementById('preise');

console.log(tbody.chOff);              // gespiegelter Attributwert
console.log(typeof tbody.chOff);       // immer string
console.log(tbody.getAttribute('charoff'));

2 string 2

Eigenschaft setzen – das Attribut ändert sich, die Darstellung nicht

const table = document.createElement('table');
const tbody = table.createTBody();
tbody.insertRow().insertCell().textContent = '3,1415';

tbody.chOff = '1';
console.log(tbody.outerHTML);
// Die Zelle wird trotzdem nicht am Komma ausgerichtet

const thead = table.createTHead();
console.log(JSON.stringify(thead.chOff)); // ohne Attribut: leere Zeichenkette

<tbody charoff="1"><tr><td>3,1415</td></tr></tbody> ""

Altes Markup bereinigen und durch CSS ersetzen

// Veraltete Ausrichtungsattribute aus allen Tabellenabschnitten entfernen
const sections = document.querySelectorAll('thead, tbody, tfoot');

for (const section of sections) {
  if (section.chOff !== '' || section.ch !== '') {
    section.removeAttribute('charoff');
    section.removeAttribute('char');
    // Moderne Alternative: Zahlen rechtsbündig mit gleich breiten Ziffern
    for (const cell of section.querySelectorAll('td')) {
      cell.style.textAlign = 'right';
      cell.style.fontVariantNumeric = 'tabular-nums';
    }
  }
}

console.log(`${sections.length} Abschnitte geprüft`);

3 Abschnitte geprüft

// Wichtig · Fallstricke

Veraltet und ohne Wirkung: In HTML5 ist das Attribut charoff obsolet. Browser werten es beim Darstellen nicht aus. Verlass dich daher nie auf chOff, um etwas auszurichten.
Keine Umwandlung in eine Zahl: Die Eigenschaft liefert immer eine Zeichenkette zurück, nie eine Zahl. Wer einen Zahlenwert braucht, muss ihn selbst umwandeln, etwa mit Number(el.chOff).
Name der Eigenschaft ≠ Name des Attributs: Die DOM-Eigenschaft heißt chOff, das HTML-Attribut dagegen charoff. Genauso gehören ch und char zusammen. Bei getAttribute() musst du also den Attributnamen verwenden.
Kompatibilität: Chrome, Firefox und Safari (Desktop und Mobil) spiegeln das Attribut. Die Eigenschaft kann aber in künftigen Versionen wegfallen. TypeScript kennzeichnet sie als @deprecated.
Die gleiche wirkungslose Eigenschaft gibt es bei HTMLTableRowElement, HTMLTableCellElement und HTMLTableColElement.

Siehe auch

HTMLTableCellElement.chOff HTMLTableSectionElement.ch HTMLTableSectionElement.rows HTMLTableSectionElement.align HTMLTableSectionElement.vAlign