Метад insertAdjacentText
Метад insertAdjacentText дазваляе
ўставіць радок у любое месца старонкі. Радок
устаўляецца адносна апарнага элемента.
Можна зрабіць устаўку перад апарным элементам
(спосаб устаўкі 'beforeBegin'), пасля
яго (спосаб устаўкі 'afterEnd'), а
таксама ў пачатак (спосаб устаўкі 'afterBegin')
ці ў канец (спосаб устаўкі 'beforeEnd')
апарнага элемента.
Сінтаксіс
апарны элемент.insertAdjacentText(спосаб устаўкі, тэкст для ўстаўкі);
Прыклад . Спосаб beforeBegin
Хай апарны элемент - гэта элемент #target.
Уставім перад ім які-небудзь тэкст:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
Вынік выканання кода:
text
<div id="target">
<p>elem</p>
</div>
Прыклад . Спосаб afterEnd
А цяпер уставім новы абзац пасля апарнага элемента:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
Вынік выканання кода:
<div id="target">
<p>elem</p>
</div>
text
Прыклад . afterBegin
Уставім новы абзац у пачатак апарнага элемента:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
Вынік выканання кода:
<div id="target">
text
<p>elem</p>
</div>
Прыклад . Спосаб beforeEnd
Уставім новы абзац у канец апарнага элемента:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
Вынік выканання кода:
<div id="target">
<p>elem</p>
text
</div>
Глядзіце таксама
-
метад
insertAdjacentElement,
які ўстаўляе элемент у зададзенае месца -
метад
insertAdjacentHTML,
які ўстаўляе код у зададзенае месца -
метад
prepend,
які ўстаўляе элементы ў пачатак -
метад
append,
які ўстаўляе элементы ў канец -
метад
appendChild,
які ўстаўляе элементы ў канец бацькі -
метад
insertBefore,
які ўстаўляе элементы перад элементам