Элемент: метод append()

Базовая линия Широко доступен

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Метод Element.append() вставляет набор Node объектов или строк после последнего дочернего элемента Element. Строки вставляются как эквивалентные узлы Text.

Отличия от Node.appendChild():

Element.append() позволяет добавлять также строки, в то время как Node.appendChild() принимает только Node объекты.
Element.append() не возвращает значения, в то время как Node.appendChild() возвращает добавленный Node объект.
Element.append() может добавлять несколько узлов и строк, в то время как Node.appendChild() может добавлять только один узел.

Синтаксис

append(param1)
append(param1, param2)
append(param1, param2, /* …, */ paramN)

Параметры

param1, …, paramN: Набор Node объектов или строк для вставки.

Возвращаемое значение

None (undefined).

Исключения

HierarchyRequestError DOMException: Выбрасывается, когда узел не может быть вставлен в указанную точку иерархии.

Примеры

Добавление элемента

let div = document.createElement("div");
let p = document.createElement("p");
div.append(p);

console.log(div.childNodes); // NodeList [ <p> ]

Добавление текста

let div = document.createElement("div");
div.append("Some text");

console.log(div.textContent); // "Some text"

Добавление элемента и текста

let div = document.createElement("div");
let p = document.createElement("p");
div.append("Some text", p);

console.log(div.childNodes); // NodeList [ #text "Some text", <p> ]

Метод append не может быть захвачен

Метод append() не захватывается оператором with. См. Symbol.unscopables для получения дополнительной информации.

let div = document.createElement("div");

with (div) {
  append("foo");
}
// ReferenceError: append is not defined

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

Спецификация
DOM # ref-for-dom-parentnode-append①

Совместимость браузеров

	Рабочие столы					Мобильные
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari на IOS	Samsung Internet	WebView Android
`append`	54	17	49	41	10	54	49	41	10	6.0	54

См. также

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Element/append