JavaScript/DOM/Document/createAttribute

Die Methode createAttribute() des document-Objekts erzeugt einen neuen Attributknoten mit einem leeren Namespace. Dieser lässt sich dann einem HTML- oder XML-Element zuordnen.

Syntax

let attribute = Document.createAttribute(name);

• name: Zeichenkette mit dem Namen des Attributs, das erzeugt werden soll. Handelt es sich hierbei um einen ungültigen Attributnamen, wirft die Methode eine DOMException.

Attribute dynamisch hinzufügen ansehen …

	function erzeugeHinweis() {
		const main = document.querySelector('main');
		const attr = document.createAttribute('class');
		attr.value = 'hinweis';
		main.setAttributeNode(attr);
	}

Das Beispiel enthält ein div ohne weitere Attribute. Unterhalb davon ist ein JavaScript-Bereich notiert. Dort wird mit document.createAttribute("class") ein neues Attribut mit Namen class erzeugt. Das Attribut hat damit aber noch keine Wirkung - es hängt weder im Elementbaum 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 attr gespeichert. Über diese Variable ist das neu erzeugte Attribut von da ab ansprechbar.

Damit das Attribut einen Inhalt 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.

Siehe auch

• DOM-Manipulation
  • Elemente dynamisch
    • erzeugen
    • entfernen
   

Weblinks

• W3C: createAttribute
• MDN: Document.createAttribute