Meetod insertAdjacentElement
Meetod insertAdjacentElement võimaldab
sisestada elemendi lehe suvalisse kohta.
Seda kasutatakse kõige sagedamini pärast elemendi loomist
kasutades createElement.
Kood sisestatakse võrreldes tugielemendiga.
Saab teha sisestuse enne
tugielementi (sisestusviis beforeBegin),
pärast seda (sisestusviis afterEnd),
samuti algusesse (sisestusviis afterBegin)
või lõppu (sisestusviis beforeEnd)
tugielemendist.
Süntaks
tugielement.insertAdjacentElement(sisestusviis, sisestatav kood);
Näide . Viis beforeBegin
Olgu tugielemendiks element #target.
Sisestame selle ette uue lõigu:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeBegin', p);
Koodi täitmise tulemus:
<p>!</p>
<div id="target">
<p>elem</p>
</div>
Näide . Viis afterEnd
Nüüd sisestame uue lõigu pärast tugielementi:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterEnd', p);
Koodi täitmise tulemus:
<div id="target">
<p>elem</p>
</div>
<p>!</p>
Näide . Viis afterBegin
Sisestame uue lõigu tugielemendi algusesse:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('afterBegin', p);
Koodi täitmise tulemus:
<div id="target">
<p>!</p>
<p>elem</p>
</div>
Näide . Viis beforeEnd
Sisestame uue lõigu tugielemendi lõppu:
<div id="target">
<p>elem</p>
</div>
let p = document.createElement('p');
p.textContent = '!';
let target = document.querySelector('#target');
target.insertAdjacentElement('beforeEnd', p);
Koodi täitmise tulemus:
<div id="target">
<p>elem</p>
<p>!</p>
</div>
Vaata ka
-
meetod
insertAdjacentHTML,
mis sisestab siltide etteantud kohta -
meetod
insertAdjacentText,
mis sisestab teksti etteantud kohta -
meetod
prepend,
mis sisestab elemendid algusesse -
meetod
append,
mis sisestab elemendid lõppu -
meetod
appendChild,
mis sisestab elemendid vanema lõppu -
meetod
insertBefore,
mis sisestab elemendid enne elementi
