пример
Создание <button> элемент:
var btn = document.createElement("BUTTON");
Результат будет:
Попробуй сам " HTML элементы часто содержит текст. Чтобы создать кнопку с текстом необходимо также создать текстовый узел , который вы добавите к <button> элемента:
пример
Создание кнопки с текстом:
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>Результат будет:
Попробуй сам " Больше "Try it Yourself" примеры ниже.
Определение и использование
createElement() метод создает узел элемента с указанным именем.
Совет: Используйте createTextNode() метод , чтобы создать текстовый узел.
Совет: После создания элемента, используйте элемент. appendChild() или элемент. insertBefore() метод , чтобы вставить его в документ.
Поддержка браузеров
| метод | |||||
|---|---|---|---|---|---|
| createElement() | да | да | да | да | да |
Синтаксис
document.createElement( nodename )Значения параметров
| параметр | Тип | Описание |
|---|---|---|
| nodename | String | Необходимые. Имя элемента, который вы хотите создать |
Технические подробности
| Возвращаемое значение: | Объект Элемент, который представляет собой созданный узел Element |
|---|---|
| DOM Версия: | Базовый уровень объекта 1 Документ |
Еще примеры
пример
Создание <p> элемент с текстом, и добавить его в документ:
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> Попробуй сам " пример
Создание <p> элемент и добавить его в <div> элемент:
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" Попробуй сам "