HTML DOM Element insertAdjacentElement() 方法

定義和用法

insertAdjacentElement() 方法將元素插入到指定位置。

合法的位置：

值 描述
afterbegin 在元素開始之后（第一個子元素）。
afterend 元素后。
beforebegin 元素前。
beforeend 在元素結束之前（最后一個子元素）。

實例

例子 1

在標題后插入一個 span 元素：

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

親自試一試

例子 2

使用 "afterbegin"：

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

親自試一試

例子 3

使用 "beforebegin"：

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

親自試一試

例子 4

使用 "beforeend"：

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

親自試一試

語法

element.insertAdjacentElement(position, element)

或

node.insertAdjacentElement(position, element)

參數

參數 描述
position

必需。相對于元素的位置：

  • afterbegin
  • afterend
  • beforebegin
  • beforeend
element 要插入的元素。

瀏覽器支持

所有瀏覽器都支持 element.insertAjacentElement()：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 支持 支持 支持 支持 支持