Metoden insertAdjacentText
Metoden insertAdjacentText låter dig
infoga en sträng var som helst på sidan. Strängen
infogas i förhållande till ett referenselement.
Du kan infoga före referenselementet
(infogningssätt 'beforeBegin'), efter
det (infogningssätt 'afterEnd'), eller
i början (infogningssätt 'afterBegin')
eller i slutet (infogningssätt 'beforeEnd')
av referenselementet.
Syntax
referenselement.insertAdjacentText(infogningssätt, text att infoga);
Exempel . Sätt beforeBegin
Låt referenselementet vara elementet #target.
Låt oss infoga lite text före det:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
Resultat av exekvering av koden:
text
<div id="target">
<p>elem</p>
</div>
Exempel . Sätt afterEnd
Låt oss nu infoga en ny textsträng efter referenselementet:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
Resultat av exekvering av koden:
<div id="target">
<p>elem</p>
</div>
text
Exempel . afterBegin
Låt oss infoga en ny textsträng i början av referenselementet:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
Resultat av exekvering av koden:
<div id="target">
text
<p>elem</p>
</div>
Exempel . Sätt beforeEnd
Låt oss infoga en ny textsträng i slutet av referenselementet:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
Resultat av exekvering av koden:
<div id="target">
<p>elem</p>
text
</div>
Se även
-
metoden
insertAdjacentElement,
som infogar ett element på en angiven plats -
metoden
insertAdjacentHTML,
som infogar kod på en angiven plats -
metoden
prepend,
som infogar element i början -
metoden
append,
som infogar element i slutet -
metoden
appendChild,
som infogar element i slutet av föräldern -
metoden
insertBefore,
som infogar element före ett element
