Signatur
Beschreibung
Die Eigenschaft align des Interfaces HTMLTableCellElement spiegelt das HTML-Attribut align einer Tabellenzelle (<td> oder <th>) wider. Sie legt fest, wie der Inhalt der Zelle horizontal ausgerichtet wird. Übliche Werte sind "left", "center", "right", "justify" und "char".
Wenn Sie die Eigenschaft lesen, erhalten Sie den Attributwert genau so, wie er im Markup steht. Fehlt das Attribut, ist das Ergebnis ein leerer String. Wenn Sie die Eigenschaft setzen, wird das Attribut im DOM geschrieben bzw. überschrieben. Der Browser prüft den Wert dabei nicht und normalisiert ihn auch nicht.
Die Eigenschaft ist veraltet. Sie ist nur noch für ältere Seiten und Altcode relevant, etwa für HTML-E-Mails oder Tabellen aus alten CMS-Systemen. Für neuen Code verwenden Sie die CSS-Eigenschaft text-align. Das geht per Stylesheet oder in JavaScript über element.style.textAlign.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $value | string | "" | Beim Setzen: die gewünschte Ausrichtung, z. B. "left", "center", "right", "justify" oder "char". |
Rückgabewert
align. Ist das Attribut nicht gesetzt, ist das Ergebnis ein leerer String "".Beispiele
Ausrichtung einer Zelle lesen
// HTML: <table><tr><td id="preis" align="right">19,99 €</td></tr></table>
const zelle = document.getElementById('preis');
console.log(zelle.align);
// Ohne gesetztes Attribut ist der Wert ein leerer String
const leer = document.createElement('td');
console.log(JSON.stringify(leer.align));Zahlenspalte rechtsbündig ausrichten (Altcode)
// Alle Zellen der dritten Spalte rechtsbündig ausrichten
const tabelle = document.querySelector('table');
for (const zeile of tabelle.rows) {
const zelle = zeile.cells[2];
if (zelle) zelle.align = 'right';
}
console.log(tabelle.rows[0].cells[2].getAttribute('align'));Modern: veraltetes align durch CSS ersetzen
// Vorhandene align-Attribute in CSS text-align umwandeln
const zellen = document.querySelectorAll('td[align], th[align]');
zellen.forEach((zelle) => {
zelle.style.textAlign = zelle.align.toLowerCase();
zelle.removeAttribute('align');
});
console.log(`${zellen.length} Zellen umgestellt`);// Wichtig · Fallstricke
- Veraltet: Das Attribut
alignan<td>und<th>gehört nicht mehr zum aktuellen HTML-Standard. Die Browser unterstützen es zwar noch, neuer Code sollte abertext-alignin CSS verwenden. - Keine Prüfung des Werts: Ungültige Werte wie
"mitte"werden ohne Fehler übernommen und bewirken einfach nichts. Der gelesene Wert entspricht dem Attribut, nicht der tatsächlich berechneten Ausrichtung. Die ermitteln Sie mitgetComputedStyle(zelle).textAlign. - Vorrang von CSS: Browser behandeln
alignals Präsentationshinweis mit geringer Spezifität. Jede CSS-Regel mittext-alignüberschreibt das Attribut. "char"und die Attributech/chOff(Ausrichtung an einem bestimmten Zeichen) werden von keinem gängigen Browser tatsächlich umgesetzt.