Signatur
Beschreibung
Die Eigenschaft align des Interfaces HTMLTableSectionElement spiegelt das HTML-Attribut align eines Tabellenabschnitts (<thead>, <tbody>, <tfoot>) wider. Sie gibt an, wie der Inhalt der Zellen in diesem Abschnitt horizontal ausgerichtet wird.
Übliche Werte sind "left", "center", "right", "justify" und "char" (Ausrichtung an einem Zeichen, siehe ch). Der Wert ist ein einfacher String: Der Browser prüft beim Setzen nicht, ob er gültig ist. Ist das Attribut nicht gesetzt, liefert die Eigenschaft einen leeren String.
Die Eigenschaft ist veraltet und nur noch aus Gründen der Abwärtskompatibilität vorhanden. In neuem Code sollte die Ausrichtung per CSS erfolgen, z. B. mit text-align auf den Zellen (td, th) des Abschnitts. Nützlich ist align vor allem, wenn man alten HTML-Code auslesen oder in modernes CSS umwandeln will.
Rückgabewert
align-Attributs, z. B. "left", "center", "right", "justify" oder "char". Ist das Attribut nicht gesetzt, ist es ein leerer String "".Beispiele
align-Wert eines tbody auslesen und setzen
// HTML: <table><tbody id="daten" align="right"><tr><td>42</td></tr></tbody></table>
const tbody = document.getElementById('daten');
console.log(tbody.align); // aktueller Wert
tbody.align = 'center';
console.log(tbody.getAttribute('align'));Leerer String bei fehlendem Attribut
const table = document.createElement('table');
const thead = table.createTHead();
console.log(JSON.stringify(thead.align));
console.log(thead.hasAttribute('align'));Altes align-Attribut in modernes CSS umwandeln
// Alle Tabellenabschnitte mit veraltetem align auf CSS umstellen
const sections = document.querySelectorAll('thead[align], tbody[align], tfoot[align]');
sections.forEach((section) => {
const alignment = section.align.toLowerCase();
if (['left', 'center', 'right', 'justify'].includes(alignment)) {
for (const cell of section.querySelectorAll('td, th')) {
cell.style.textAlign = alignment;
}
}
section.removeAttribute('align');
});
console.log(`${sections.length} Abschnitte umgestellt`);// Wichtig · Fallstricke
- Veraltet: Das
align-Attribut für Tabellenabschnitte ist seit HTML5 nicht mehr konform. Nutzen Sie CSS, z. B.tbody td { text-align: right; }. - Die Eigenschaft wird zwar in allen Browsern unterstützt, die Darstellung ist aber nicht einheitlich. Vor allem
"char"und"justify"werden von den meisten Browsern gar nicht oder nur eingeschränkt umgesetzt. - Beim Setzen wird der Wert nicht geprüft. Auch ungültige Werte wie
"mitte"landen unverändert im Attribut und bleiben ohne Wirkung. - CSS-Regeln mit
text-alignauf den Zellen haben Vorrang vor der Ausrichtung durch das Attribut. Deshalb kann eine Änderung vonalignscheinbar nichts bewirken.