JavaScript/DOM/Element/setAttributeNode

Aus SELFHTML-Wiki
< JavaScript‎ | DOM‎ | Element
Wechseln zu: Navigation, Suche

Die Methode Element.setAttributeNode fügt einen neuen Attributknoten in ein Element ein. Ist der Attributknoten bereits vorhanden, wird der alte Knoten durch den neuen ersetzt. Ist er noch nicht vorhanden, wird er neu angelegt. Heute gelten Attribute nicht mehr als Attributsknoten, und so wird folgerichtig im allgemeinen die setAttribute()-Methode verwendet.

Syntax

var attrName = element.setAttributeNode(name);

  • name: Name des Attributs, das gesetzt werden soll ( als Zeichenkette)
  • attrName: der ersetzte Attributknoten, falls es vorher schon einen gab.

Anwendungsbeispiel

Beispiel ansehen …
    function erzeugeHinweis() {
      var div = document.getElementsByTagName('div')[0];
      var att = document.createAttribute('class');
      att.value = 'hinweis';
      div.setAttributeNode(att);
    }
</nowiki>

Das Beispiel enthält ein div ohne weitere Attribute. Bei einem klick auf den Button wird in der Funktion erzeugeHinweis dieses Div-Element geholt und anschließend mit document.createAttribute("class") ein neues Attribut mit Namen class erzeugt. Das Attribut hat damit aber noch keine Wirkung – es hängt weder im Elementenbaum des Dokuments, noch hat es einen Wert. Das Attribut ist lediglich als Objekt erzeugt.

Die Methode createAttribute() gibt das erzeugte Objekt, also in dem Fall das class-Attribut, zurück. Der Rückgabewert wird in der Variablen att gespeichert. Über diese Variable ist das neu erzeugte Attribut von da ab ansprechbar.

Damit das Attribut einen Inhalt, bzw. value erhält, wird der dem Attributknoten über die Objekteigenschaft setAttributeNode() der gewünschte Wert hinweis zugewiesen.

Sobald dies passiert ist, wird das div mit den im CSS festgelegten Angaben angezeigt.

Weblinks