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

Question

我正在用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);
}

它在底部列出了最近的事件，在顶部列出了最早的事件。 我该如何扭转呢？ 我希望它在顶部显示最新事件。

Answer 1

代替子元素。 由于没有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()更多信息

Answer 2

appendChild将节点添加为最后一个子节点。 您要在第一个节点之前插入：

element.insertBefore(para, element.childNodes[0]);