Методот insertAdjacentText

Методот insertAdjacentText овозможува вметнување на стринг каде било на страницата. Стрингот се вметнува во однос на референтниот елемент. Може да се направи вметнување пред референтниот елемент (начин на вметнување 'beforeBegin'), после него (начин на вметнување 'afterEnd'), како и на почетокот (начин на вметнување 'afterBegin') или на крајот (начин на вметнување 'beforeEnd') на референтниот елемент.

Синтакса

javascriptреферентен елемент.insertAdjacentText(начин на вметнување, текст за вметнување);

Пример . Начин beforeBegin

Нека референтниот елемент е елементот #target. Да вметнеме пред него некој текст:

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

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

Резултат од извршувањето на кодот:

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

Пример . Начин afterEnd

А сега да вметнеме нов пасус после референтниот елемент:

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

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

Резултат од извршувањето на кодот:

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

Пример . afterBegin

Да вметнеме нов пасус на почетокот на референтниот елемент:

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

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

Резултат од извршувањето на кодот:

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

Пример . Начин beforeEnd

Да вметнеме нов пасус на крајот на референтниот елемент:

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

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

Резултат од извршувањето на кодот:

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

Погледнете ги исто така