Metoda insertAdjacentText

Metoda insertAdjacentText omogoča vstavitev niza kamorkoli na stran. Niz je vstavljen glede na referenčni element. Možno je vstaviti pred referenčni element (način vstavljanja 'beforeBegin'), za njim (način vstavljanja 'afterEnd'), ali pa na začetek (način vstavljanja 'afterBegin') ali konec (način vstavljanja 'beforeEnd') referenčnega elementa.

Sintaksa

javascriptreferenčni element.insertAdjacentText(način vstavljanja, besedilo za vstaviti);

Primer . Način beforeBegin

Naj bo referenčni element element #target. Vstavimo nekaj besedila pred njim:

html<div id="target">
  <p>elem</p>
</div>

javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'besedilo');

Rezultat izvajanja kode:

htmlbesedilo
<div id="target">
  <p>elem</p>
</div>

Primer . Način afterEnd

Zdaj pa vstavimo nov odstavek za referenčnim elementom:

html<div id="target">
  <p>elem</p>
</div>

javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'besedilo');

Rezultat izvajanja kode:

html<div id="target">
  <p>elem</p>
</div>
besedilo

Primer . afterBegin

Vstavimo nov odstavek na začetek referenčnega elementa:

html<div id="target">
  <p>elem</p>
</div>

javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'besedilo');

Rezultat izvajanja kode:

html<div id="target">
  besedilo
  <p>elem</p>
</div>

Primer . Način beforeEnd

Vstavimo nov odstavek na konec referenčnega elementa:

html<div id="target">
  <p>elem</p>
</div>

javascriptlet target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'besedilo');

Rezultat izvajanja kode:

html<div id="target">
  <p>elem</p>
  besedilo
</div>

Glejte tudi