Метод «insertAdjacentHTML» — это метод JavaScript, который позволяет вставлять содержимое HTML в определенную позицию относительно элемента в DOM (объектная модель документа). Он обеспечивает больший контроль над тем, куда вставляется новый контент, по сравнению с другими методами, такими как «innerHTML». Метод “insertAdjacentHTML” принимает два параметра: позицию, в которую должен быть вставлен HTML-код, и само содержимое HTML.

Существует четыре возможных места, куда вы можете вставить HTML-контент с помощью «insertAdjacentHTML»:

1. “beforebegin”: вставляет HTML-контент как предыдущий одноуровневый элемент, непосредственно перед самим целевым элементом.
2. “afterbegin”: вставляет содержимое HTML в качестве первого дочернего элемента внутри целевого элемента перед любым существующим содержимым.
3. “beforeend”: вставляет содержимое HTML в качестве последнего дочернего элемента внутри целевого элемента после любого существующего содержимого.
4. “afterend”: вставляет HTML-содержимое как следующий одноуровневый элемент, сразу после самого целевого элемента.

Вот пример использования метода «insertAdjacentHTML»:

const targetElement = document.getElementById('target');
const htmlContent = '<div>New HTML content</div>';
targetElement.insertAdjacentHTML('beforebegin', htmlContent);

В этом примере перед targetElementвставляется новый элемент