Gebräuchliche Attribute und Events in HTML und XHTML
(Auszug aus "HTML & XHTML ─ kurz & gut" von Jennifer Niederst Robbins)
Eine Reihe von Attributen kann in fast allen Elementen verwendet werden. Wir verwenden wir hier die gleichen Abkürzungen wie in den Empfehlungen des W3C. Diese Seite dient als Referenz für die »Alphabetische Liste der HTML- und XHTML-Elemente« und erklärt die Abkürzungen für die einzelnen Attribute.
In HTML 4.01 und XHTML 1.0 werden die Attribute und Events einer der Gruppen Kern, Internationalisierung (Internationalization), Fokus (Focus) und Events zugeordnet. In HTML 5 gibt es dagegen einen Satz globaler Attribute (Global Attributes), die für alle HTML-Elemente gelten.
HTML 4.01 und XHTML 1.0
Kern
Wenn unter dem Attribut der Begriff Kern steht, sind damit die Kernattribute gemeint, die auf die Mehrzahl der Elemente angewendet werden können (wie in dem jeweiligen Eintrag vermerkt):
-
id
Weist dem Element eine eindeutige Kennung zu.
-
class
Weist dem Element einen oder mehrere Klassennamen zu.
-
style
Weist einem Element bestimmte Stilinformationen (CSS) zu.
-
title
Enthält einen Titel oder zusätzliche Informationen zu dem Element.
Internationalisierung
Taucht in der Attributliste der Begriff Internationalisierung auf, so bedeutet dies, dass für das Element die folgenden Attribute für Sprachen und Leserichtungen definiert werden können:
-
dir
Gibt die Leserichtung für das Element an (von links nach rechts oder umgekehrt).
-
lang
Gibt anhand des Sprachcodes die Sprache für ein bestimmtes Element an.
-
Nur XHTML. Gibt die Sprache der Elemente in einem XHTML-Dokument an.
Fokus
Fokus bedeutet, dass ein Element markiert ist und Benutzereingaben empfangen kann, wie beispielsweise einen Link oder ein Formularelement. Wo Fokus angegeben ist, können folgende Fokus-Attribute und -Events auf das Element angewendet werden:
-
accesskey="character"
Weist einem Link oder Formularfeld ein bestimmtes Tastaturkürzel zu. Der Wert ist ein einzelnes Zeichen. Benutzer können dann mit einem der folgenden Kurzbefehle auf das markierte Element zugreifen: Alt-<Zeichen> (PC) oder Ctrl-<Zeichen> (Mac).
-
onblur
Das Element verliert den Fokus, entweder durch eine Bewegung des Mauszeigers oder durch Drücken der Tabulatortaste.
-
onfocus
Das Element erhält den Fokus, entweder durch eine Bewegung des Mauszeigers oder durch Drücken der Tabulatortaste.
-
tabindex="Zahl"
Gibt die Position des aktuellen Elements in der Tabulatorreihenfolge des aktuellen Dokuments an. Gültig sind Werte zwischen 0 und 32.767. Ist dieses Attribut gesetzt, kann man sich mit der Tabulatortaste durch die Links (oder Formularfelder) einer Seite bewegen.
Events
Werden Events für das Element aufgelistet, so bedeutet dies, dass die Kern-Events von Skriptsprachen auf das Element angewendet werden können. Weitere Events, die nicht zum Sprachkern gehören, werden separat aufgeführt:
-
onclick
Ein Element wird angeklickt.
-
ondblclick
Ein Element wird doppelt angeklickt.
-
onkeydown
Tastendruck, während das Element aktiviert ist (z. B. durch vorheriges Anklicken).
-
onkeypress
Drücken und Loslassen einer Taste, während das Element aktiviert ist.
-
onkeyup
Loslassen einer Taste, während das Element aktiviert
-
onmousedown
Bei gedrückter Maustaste über dem Element.
-
onmousemove
Bei Mausbewegung über dem Element.
-
onmouseout
Der Mauszeiger wird vom Element wegbewegt.
-
onmouseover
Bei Mausbewegung über das Element.
-
onmouseup
Beim Loslassen der Maustaste über dem Element.
HTML 5
Globale Attribute
Zusätzlich zu den Attributen id, class, style, title, dir, lang, accesskey und tabindex, die von HTML 4.01 übernommen wurden, definiert HTML 5 die folgenden globalen Attribute, die für sämtliche Elemente anwendbar sind:
-
contenteditable="true|false"
Zeigt an, dass der Benutzer das Element verändern kann. Dieses Attribut wird bereits von vielen aktuellen Browsern unterstützt.
-
contextmenu="ID des Menüelements"
Verweist auf ein Kontextmenü für das Element. Das Kontextmenü muss vom Benutzer aufgerufen werden, beispielsweise durch einen Rechtsklick.
-
draggable="true|false"
Gibt an, ob das Element mit der Maus durch Ziehen und Loslassen an eine neue Fensterposition bewegt werden kann.
-
hidden (hidden="hidden" in XHTML)
Verhindert, dass ein Element und darin verschachtelte weitere Elemente vom Browser dargestellt werden. Skripte und Formularelemente im versteckten Teil werden dennoch ausgeführt, aber dem Benutzer nicht angezeigt.
-
itemid="Text"
Teil des Mikrodaten-Systems zur Einbettung maschinenlesbarer Daten. Das Attribut itemid markiert einen global anerkannten Identifier (z. B. die ISBN-Nummer für ein Buch). Es wird zusammen mit dem Attribut itemtype im gleichen Dokument verwendet, das auch das Attribut itemscope enthält.
-
itemprop="Text"
Teil des Mikrodaten-Systems zur Einbettung maschinenlesbarer Daten. Das Attribut itemprop gibt den Namen einer Eigenschaft (property) an. Der Inhalt des Elements bestimmt den Attributwert. Der Wert kann auch ein URL sein, der durch das Attribut href in einem a-Element oder mit dem Attribut src im img-Element angegeben wird.
-
itemref="durch Leerzeichen getrennte Liste mit IDs"
Teil des Mikrodaten-Systems zur Einbettung maschinenlesbarer Daten. Das Attribut itemref gibt eine Liste von Elementen der aktuellen Seite an (in Form von ID-Werten), die in einem item enthalten sein sollen. Das Attribut itemref muss im gleichen Element verwendet werden wie das itemscope-Attribut, mit dem das item deklariert wurde.
-
itemscope
Teil des Mikrodaten-Systems zur Einbettung maschinenlesbarer Daten. Das Attribut itemscope erzeugt ein neues item. Hierbei handelt es sich um eine Gruppe von Eigenschaften (Paaren aus Name und Wert).
-
itemtype="URL oder umgekehrtes DNS-Label"
Teil des Mikrodaten-Systems zur Einbettung maschinenlesbarer Daten. Das Attribut itemtype bezeichnet anhand eines URL ("http://vocab.example.net/book") oder eines umgekehrten DNS-Labels (z. B. "com.example.person") einen standardisierten item-Typ. Das Attribut itemtype wird im gleichen Element verwendet, das auch das Attribut itemscope enthält.
-
spellcheck="true|false"
Gibt an, ob Rechtsschreibung und Grammatik für das Element geprüft werden.
HTML 5-Event-Handler
Sofern nicht anders angegeben, können die folgenden Event-Handler mit beliebigen HTML 5-Elementen verwendet werden:
onabort | onmessage* |
onafterprint | onmousedown |
onbeforeprint | onmousemove |
onbeforeunload | onmouseout |
onblur* | onmouseover |
oncanplay | onmouseup |
oncanplaythrough | onmousewheel |
onchange | onoffline |
onclick | ononline |
oncontextmenu | onpagehide* |
ondblclick | onpageshow* |
ondrag | onpopstate* |
ondragend | onpause |
ondragenter | onplay |
ondragleave | onplaying |
ondragover | onprogress |
ondragstart | onratechange |
ondrop | onreadystatechange |
ondurationchange | onredo* |
onemptied | onresize* |
onended | onscroll |
onerror | onseeked |
onfocus* | onseeking |
onformchange | onselect |
onforminput | onshow |
oninput | onstalled |
oninvalid | onsubmit |
onkeydown | onsuspend |
onkeypress | ontimeupdate |
onkeyup | onundo* |
onload* | onunload* |
onloadeddata | onvolumechange |
onloadedmetadata | onwaiting |
onloadstart |
Hinweis: onblur, onerror, onfocus und onload verhalten sich leicht unterschiedlich, wenn sie auf das body-Element angewendet werden, da body diese Event-Handler von seinem Elternfenster erbt.
*Event-Handler für das Objekt Window, wenn dieses mit dem body-Element verwendet wird.
<< zurück | vor >> |
Tipp der data2type-Redaktion: Zum Thema HTML & XHTML bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an: |
Copyright © 2010 O’Reilly Verlag GmbH & Co. KG
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "HTML & XHTML ─ kurz & gut" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.
O’Reilly Verlag GmbH & Co. KG, Balthasarstraße 81, 50670 Köln, kommentar(at)oreilly.de