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
referenč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:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'besedilo');
Rezultat izvajanja kode:
besedilo
<div id="target">
<p>elem</p>
</div>
Primer . Način afterEnd
Zdaj pa vstavimo nov odstavek za referenčnim elementom:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'besedilo');
Rezultat izvajanja kode:
<div id="target">
<p>elem</p>
</div>
besedilo
Primer . afterBegin
Vstavimo nov odstavek na začetek referenčnega elementa:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'besedilo');
Rezultat izvajanja kode:
<div id="target">
besedilo
<p>elem</p>
</div>
Primer . Način beforeEnd
Vstavimo nov odstavek na konec referenčnega elementa:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'besedilo');
Rezultat izvajanja kode:
<div id="target">
<p>elem</p>
besedilo
</div>
Glejte tudi
-
metoda
insertAdjacentElement,
ki vstavi element na določeno mesto -
metoda
insertAdjacentHTML,
ki vstavi kodo na določeno mesto -
metoda
prepend,
ki vstavi elemente na začetek -
metoda
append,
ki vstavi elemente na konec -
metoda
appendChild,
ki vstavi elemente na konec starša -
metoda
insertBefore,
ki vstavi elemente pred element