Beispiel
Erstellen Sie ein <button> Element:
var btn = document.createElement("BUTTON");
Das Ergebnis wird sein:
Versuch es selber " HTML-Elemente enthalten oft Text. Eine Schaltfläche mit dem Text erstellen Sie auch einen Text Knoten erstellen müssen , die Sie zum anhängen <button> Element:
Beispiel
Erstellen Sie eine Schaltfläche mit dem Text:
var btn = document.createElement("BUTTON");
// Create a <button> element
var t = document.createTextNode("CLICK ME");
// Create a text node
btn.appendChild(t);
// Append the text to <button>
document.body.appendChild(btn);
// Append <button> to <body>Das Ergebnis wird sein:
Versuch es selber " Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.
Definition und Verwendung
Die createElement() Methode erzeugt einen Elementknoten mit dem angegebenen Namen.
Tipp: Verwenden Sie die createTextNode() Methode einen Textknoten zu erstellen.
Tipp: Nachdem das Element erstellt wird, die Verwendung Element. appendChild() oder Element. insertBefore() Methode , um es in das Dokument einzufügen.
Browser-Unterstützung
| Methode | |||||
|---|---|---|---|---|---|
| createElement() | Ja | Ja | Ja | Ja | Ja |
Syntax
document.createElement( nodename )Parameterwerte
| Parameter | Art | Beschreibung |
|---|---|---|
| nodename | String | Erforderlich. Der Name des Elements, das Sie erstellen möchten |
Technische Details
| Rückgabewert: | Ein Element-Objekt, das den erstellten Element Knoten repräsentiert |
|---|---|
| DOM Version: | Core Level 1 Document Object |
Mehr Beispiele
Beispiel
Erstellen Sie ein <p> Element mit etwas Text, und fügen Sie sie auf das Dokument:
var para = document.createElement("P");
// Create a <p> element
var t =
document.createTextNode("This is a paragraph");
// Create a text node
para.appendChild(t);
// Append the text to <p>
document.body.appendChild(para);
// Append <p> to <body> Versuch es selber " Beispiel
Erstellen Sie ein <p> Element und fügen Sie es zu einem <div> Elemente:
var para = document.createElement("P");
// Create a <p> element
var t =
document.createTextNode("This is a paragraph.");
// Create a text node
para.appendChild(t);
// Append the text to <p>
document.getElementById("myDIV").appendChild(para);
// Append <p> to <div> with id="myDIV" Versuch es selber "