如何在 JavaScript 中的另一個元素之後插入一個元素

要將 HTML 元素附加到另一個元素，可以使用 appendChild() 目標元素對象的方法。

appendChild() 方法追加一個節點作為現有節點的最後一個子節點。

target.appendChild(elem);

假設您有以下列表元素：

<ul id="drinks">
    <li>Coffee</li>
    <li>Water</li>
</ul>

現在您想在列表末尾附加另一個元素。您可以使用以下代碼：

const drinks = document.querySelector('#drinks');

// Create a <li> element
const elem = document.createElement("li");

// Create a new text node
const text = document.createTextNode("Tea");

// Append text node to <li> node
elem.appendChild(text);

// Finally, append <li> to <ul> node
drinks.appendChild(elem);

查看這篇文章，了解更多關於在 JavaScript 中將元素插入 DOM 的信息。