Создание новых узлов в JavaScript
В JavaScript новые узлы могут быть созданы с помощью методов DOM (Document Object Model) API. DOM API позволяет взаимодействовать с HTML и XML документами в браузере, создавать новые элементы, добавлять, изменять и удалять существующие элементы.
Создание нового узла начинается с создания элемента с помощью метода createElement()
объекта document
. Например, чтобы создать новый элемент div
, нужно вызвать метод createElement('div')
.
let divElement = document.createElement('div');
После создания элемента, можно задать ему атрибуты, например, класс, идентификатор, стиль и другие, используя свойство setAttribute()
.
divElement.setAttribute('class', 'my-class');
divElement.setAttribute('id', 'my-id');
Затем можно добавить содержимое внутрь элемента, используя свойство textContent
или метод innerHTML
.
divElement.textContent = 'Hello World!';
И, наконец, элемент можно добавить в DOM дерево с помощью метода appendChild()
, указав родительский элемент, в который нужно добавить новый элемент.
document.body.appendChild(divElement);
В результате кода выше будет создан новый div
элемент с классом my-class
, идентификатором my-id
и текстом Hello World!
, который будет добавлен в конец тела документа.
Это пример создания простого элемента, но DOM API предоставляет множество других методов и свойств, которые могут быть использованы для создания более сложных элементов, изменения и удаления уже существующих элементов.