insertAdjacentHTML

Element arabiriminin insertAdjacentHTML() method’u, belirtilen metni ( text ) HTML veya XML olarak parse eder ve sonuçlanan düğümleri belirtilen bir konumdaki ( position ) DOM ağacına ekler. Kullanıldığı elemanı yeniden parse etmez ve bu nedenle o elemanın içindeki mevcut elemanları bozmaz. Bu, serileştirmenin fazladan adımını önler, doğrudan innerHTML manipülasyonundan çok daha hızlı hale getirir.

Sözdizimi ( Syntax )

element.insertAdjacentHTML(position, text);

Parametreler

position: Element’e göre konumu temsil eden bir DOMString olmalıdır; seçenekler aşağıya yazılmıştır.
- beforebegin: Element’in kendisinden önce.
- afterbegin: Element’in hemen içinde, ilk çocuğundan önce.
- beforeend: Element’in hemen içinde, son çocuğundan sonra.
- afterend: Element’in kendisinden sonra.
text: HTML veya XML olarak parse edilecek ve ağaca eklenecek string.

Konum Adların Görselleştirelim

<!-- beforebegin -->
<p>
  <!-- afterbegin -->
  foo
  <!-- beforeend -->
</p>
<!-- afterend -->

Örnek

// <div id="one">one</div>
var d1 = document.getElementById("one");
d1.insertAdjacentHTML("afterend", '<div id="two">two</div>');

// At this point, the new structure is:
// <div id="one">one</div><div id="two">two</div>