insertAdjacentText Metodu
insertAdjacentText metodu
bir dizeyi sayfada herhangi bir yere eklemeye
izin verir. Dize referans elemanına göre
eklenir. Referans elemanından önce ekleme
yapılabilir (ekleme yöntemi 'beforeBegin'),
ondan sonra (ekleme yöntemi 'afterEnd'),
ayrıca referans elemanının başına (ekleme yöntemi 'afterBegin')
veya sonuna (ekleme yöntemi 'beforeEnd')
ekleme yapılabilir.
Sözdizimi
referans elemanı.insertAdjacentText(ekleme yöntemi, eklenecek metin);
Örnek . beforeBegin Yöntemi
Referans elemanının #target elemanı
olduğunu varsayalım. Onun önüne bir metin ekleyelim:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
Kodun çalıştırılmasının sonucu:
text
<div id="target">
<p>elem</p>
</div>
Örnek . afterEnd Yöntemi
Şimdi referans elemanından sonra yeni bir paragraf ekleyelim:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
Kodun çalıştırılmasının sonucu:
<div id="target">
<p>elem</p>
</div>
text
Örnek . afterBegin
Referans elemanının başına yeni bir paragraf ekleyelim:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
Kodun çalıştırılmasının sonucu:
<div id="target">
text
<p>elem</p>
</div>
Örnek . beforeEnd Yöntemi
Referans elemanının sonuna yeni bir paragraf ekleyelim:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
Kodun çalıştırılmasının sonucu:
<div id="target">
<p>elem</p>
text
</div>
Ayrıca Bakınız
-
insertAdjacentElementmetodu,
bir elemanı belirtilen yere ekler -
insertAdjacentHTMLmetodu,
kodu belirtilen yere ekler -
prependmetodu,
elemanları başa ekler -
appendmetodu,
elemanları sona ekler -
appendChildmetodu,
elemanları ebeveynin sonuna ekler -
insertBeforemetodu,
elemanları bir elemandan önce ekler