HTML DOM Element insertAdjacentElement() Methode

Definitie en gebruik

insertAdjacentElement() De methode voegt een element in op de gespecificeerde positie in.

Legitieme posities:

Waarde Beschrijving
afterbegin Na de start van het element (de eerste onderliggende element).
afterend Achter het element.
beforebegin Voor het element.
beforeend Voor de afsluiting van het element (de laatste onderliggende element).

Voorbeeld

Voorbeeld 1

Een span-element invoegen achter de titel:

const span = document.getElementById("mySpan");
const h2 = document.getElementById("myH2");
h2.insertAdjacentElement("afterend", span);

Probeer het zelf

Voorbeeld 2

Gebruik "afterbegin":

const span = document.getElementById("mySpan");
const h2 = document.getElementById("myH2");
h2.insertAdjacentElement("afterbegin", span);

Probeer het zelf

Voorbeeld 3

Gebruik "beforebegin":

const span = document.getElementById("mySpan");
const h2 = document.getElementById("myH2");
h2.insertAdjacentElement("beforebegin", span);

Probeer het zelf

Voorbeeld 4

Gebruik "beforeend":

const span = document.getElementById("mySpan");
const h2 = document.getElementById("myH2");
h2.insertAdjacentElement("beforeend", span);

Probeer het zelf

Syntaxis

element.insertAdjacentElement(positie, element)

of

node.insertAdjacentElement(positie, element)

Parameters

Parameters Beschrijving
positie

Verplicht. Positie ten opzichte van het element:

  • afterbegin
  • afterend
  • beforebegin
  • beforeend
element Het te inserteren element.

Browser ondersteuning

Alle browsers ondersteunen element.insertAdjacentElement()

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Ondersteuning Ondersteuning Ondersteuning Ondersteuning Ondersteuning Ondersteuning