Metoden insertAdjacentText

Metoden insertAdjacentText giver mulighed for at indsætte en streng hvor som helst på siden. Strengen indsættes i forhold til et referenceelement. Du kan foretage indsættelse før referenceelementet (indsatmetode 'beforeBegin'), efter det (indsatmetode 'afterEnd'), samt i begyndelsen (indsatmetode 'afterBegin') eller i slutningen (indsatmetode 'beforeEnd') af referenceelementet.

Syntaks

javascriptreferenceelement.insertAdjacentText(indsatmetode, tekst til indsættelse);

Eksempel . Metode beforeBegin

Lad referenceelementet være elementet #target. Lad os indsætte noget tekst før det:

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

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

Resultat af kodeudførelse:

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

Eksempel . Metode afterEnd

Lad os nu indsætte en ny afsnit efter referenceelementet:

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

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

Resultat af kodeudførelse:

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

Eksempel . afterBegin

Lad os indsætte en ny afsnit i begyndelsen af referenceelementet:

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

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

Resultat af kodeudførelse:

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

Eksempel . Metode beforeEnd

Lad os indsætte en ny afsnit i slutningen af referenceelementet:

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

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

Resultat af kodeudførelse:

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

Se også