Метод 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>

Видите такође