Metode insertAdjacentText
Metode insertAdjacentText memungkinkan
untuk menyisipkan string di mana saja pada halaman. String
disisipkan relatif terhadap elemen acuan.
Dapat dilakukan penyisipan sebelum elemen acuan
(cara penyisipan 'beforeBegin'), setelahnya
(cara penyisipan 'afterEnd'), serta
di awal (cara penyisipan 'afterBegin')
atau di akhir (cara penyisipan 'beforeEnd')
elemen acuan.
Sintaks
elemen acuan.insertAdjacentText(cara penyisipan, teks untuk disisipkan);
Contoh . Cara beforeBegin
Misalkan elemen acuan adalah elemen #target.
Mari kita sisipkan teks apa pun di depannya:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
Hasil eksekusi kode:
text
<div id="target">
<p>elem</p>
</div>
Contoh . Cara afterEnd
Sekarang mari kita sisipkan paragraf baru setelah elemen acuan:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
Hasil eksekusi kode:
<div id="target">
<p>elem</p>
</div>
text
Contoh . afterBegin
Mari kita sisipkan paragraf baru di awal elemen acuan:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
Hasil eksekusi kode:
<div id="target">
text
<p>elem</p>
</div>
Contoh . Cara beforeEnd
Mari kita sisipkan paragraf baru di akhir elemen acuan:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
Hasil eksekusi kode:
<div id="target">
<p>elem</p>
text
</div>
Lihat juga
-
metode
insertAdjacentElement,
yang menyisipkan elemen di tempat yang ditentukan -
metode
insertAdjacentHTML,
yang menyisipkan kode di tempat yang ditentukan -
metode
prepend,
yang menyisipkan elemen di awal -
metode
append,
yang menyisipkan elemen di akhir -
metode
appendChild,
yang menyisipkan elemen di akhir induk -
metode
insertBefore,
yang menyisipkan elemen sebelum elemen
