Az insertAdjacentText metódus
A insertAdjacentText metódus lehetővé teszi
egy sztring beszúrását a weboldal bármely pontjára. A sztring
egy referenciaelemhez képest kerül beszúrásra.
A beszúrás elvégezhető a referenciaelem elött
(beszúrási mód 'beforeBegin'), utána
(beszúrási mód 'afterEnd'), valamint a referenciaelem elejére
(beszúrási mód 'afterBegin')
végére (beszúrási mód 'beforeEnd').
Szintaxis
referenciaelem.insertAdjacentText(beszúrási mód, beszúrandó szöveg);
Példa . beforeBegin mód
Tegyük fel, hogy a referenciaelem a #target elem.
Szúrjunk bele elé valamilyen szöveget:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
A kód végrehajtásának eredménye:
text
<div id="target">
<p>elem</p>
</div>
Példa . afterEnd mód
Most pedig szúrjunk be egy új bekezdést a referenciaelem után:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
A kód végrehajtásának eredménye:
<div id="target">
<p>elem</p>
</div>
text
Példa . afterBegin
Szúrjunk be egy új bekezdést a referenciaelem elejére:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
A kód végrehajtásának eredménye:
<div id="target">
text
<p>elem</p>
</div>
Példa . beforeEnd mód
Szúrjunk be egy új bekezdést a referenciaelem végére:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
A kód végrehajtásának eredménye:
<div id="target">
<p>elem</p>
text
</div>
Lásd még
-
a
insertAdjacentElementmetódus,
amely egy elemet szúr be a megadott helyre -
a
insertAdjacentHTMLmetódus,
amely kódot szúr be a megadott helyre -
a
prependmetódus,
amely elemeket szúr be az elejére -
a
appendmetódus,
amely elemeket szúr be a végére -
a
appendChildmetódus,
amely elemeket szúr be a szülő végére -
a
insertBeforemetódus,
amely elemeket szúr be egy elem elé