使用JavaScript反转添加到DOM中的元素的顺序

Reverse the order of elements added to DOM with JavaScript

本文关键字：元素 顺序 DOM JavaScript 添加 使用      更新时间：2023-09-26

我正在制作一款JavaScript游戏，并且需要一个事件日志。如果我攻击了，它会告诉我是命中还是未命中。下面是我的代码:

function eventlogshow (text){
    var para = document.createElement("p");
    var node = document.createTextNode(text);
    para.appendChild(node);
    var element = document.getElementById("eventlog");
    element.appendChild(para);
}

它将最近的事件列在底部，最老的列在顶部。我该如何扭转这一局面?我想让它在顶部显示最近的事件

改为添加子元素。由于没有prependChild()函数，您需要"将其插入到第一个子函数之前":

function eventlogshow (text){
    var para = document.createElement("p");
    var node = document.createTextNode(text);
    para.appendChild(node);
    var element = document.getElementById("eventlog");
    element.insertBefore(para, element.firstChild);
}

这里有一个类似的问题:如何将DOM元素设置为第一个子元素?

了解Node.firstChild和Node.insertBefore()

appendChild添加节点作为最后一个子节点。您希望在第一个节点之前插入:

element.insertBefore(para, element.childNodes[0]);
相关文章：