--- title: document.createElement slug: DOM/document.createElement tags: - DOM - Gecko translation_of: Web/API/Document/createElement ---

Общая информация

В HTML-документах создает элемент c тем тегом, что указан в аргументе или HTMLUnknownElement, если имя тега не распознаётся.

В XUL-документах создает указанный в аргументе элемент XUL.

В остальных случаях создаёт элемент с нулевым NamespaceURI.

Параметры

var element = document.createElement(tagName, [options]);

element — созданый объект элемента.
tagName — строка, указывающая элемент какого типа должен быть создан. nodeName создается и инициализируется со значением tagName.
options — необязательный параметр, объект ElementCreationOptions, который может содержать только поле is, указывающее имя пользовательского элемента, созданного с помощью customElements.define() (см. Веб-компоненты).

Пример

Данный пример создает новый элемент <div> и вставляет его перед элементом с идентификатором org_div1:

<!DOCTYPE html>
<html>
<head>
<title>||Работа с элементами||</title>
</head>

<body>
<div><h1>Привет!</h1></div>
<div id='org_div1'>Текст выше сгенерирован автоматически.</div>
</body>

<script>
  document.body.onload = addElement;
  var my_div = newDiv = null;

  function addElement() {

    // Создаем новый элемент div
    // и добавляем в него немного контента

    var newDiv = document.createElement("div");
        newDiv.innerHTML = "<h1>Привет!</h1>";

    // Добавляем только что созданый элемент в дерево DOM

    my_div = document.getElementById("org_div1");
    document.body.insertBefore(newDiv, my_div);
  }
</script>
</html>

Заметки

Если существуют атрибуты со значениями по умолчанию, атрибуты узлов предоставляющие их создаются автоматически и применяются к элементу.

Для создания элементов с заданым пространством имен используйте метод createElementNS.

Реализация createElement в Gecko не соответствует DOM спецификации для XUL и XHTML документов: localName и namespaceURI не устанавливаются в null в созданном документе. Смотрите {{ Bug(280692) }} для подробностей.

Для обратной совместимости с предыдущими версиями спецификации пользовательских элементов некоторые браузеры позволяют передавать здесь строку вместо объекта, где значением строки является имя тега пользовательского элемента.

Спецификации

DOM 2 Модуль: createElement

{{ languages( { "fr": "fr/DOM/document.createElement", "it": "it/DOM/document.createElement", "pl": "pl/DOM/document.createElement" } ) }}