我有一个元素E,我向它添加了一些元素。突然间,我发现下一个要追加的元素应该是e的第一个子元素,有什么诀窍,怎么做呢?方法unshift不起作用,因为E是一个对象,而不是数组。

很长的路要走,遍历E的孩子,并移动他们的键++,但我相信有一个更好的方法。


当前回答

我认为您正在寻找jQuery中的.prepend函数。示例代码:

$("#E").prepend("<p>Code goes here, yo!</p>");

其他回答

2018年版- prepend

parent.prepend(newChild)  // [newChild, child1, child2]

这是现代JS!它比以前的选项更具可读性。它目前在Chrome, FF和Opera中可用。

添加到末尾的等效方法是append,替换旧的appendChild

parent.append(newChild)  // [child1, child2, newChild]

高级用法

您可以传递多个值(或使用展开运算符…)。 任何字符串值都将作为文本元素添加。

例子:

parent.prepend(newChild, "foo")   // [newChild, "foo", child1, child2]

const list = ["bar", newChild]
parent.append(...list, "fizz")    // [child1, child2, "bar", newChild, "fizz"]

相关DOM方法

阅读更多——孩子。之前和孩子,之后 阅读更多- child.replaceWith

Mozilla的文档

我可以用

重构为函数的接受答案:

function prependChild(parentEle, newFirstChildEle) {
    parentEle.insertBefore(newFirstChildEle, parentEle.firstChild)
}

你可以实现它直接在你所有的窗口html元素。 像这样:

HTMLElement.prototype.appendFirst = function(childNode) {
    if (this.firstChild) {
        this.insertBefore(childNode, this.firstChild);
    }
    else {
        this.appendChild(childNode);
    }
};

我创建这个原型是为了将元素前置到父元素。

Node.prototype.prependChild = function (child: Node) {
    this.insertBefore(child, this.firstChild);
    return this;
};

我认为您正在寻找jQuery中的.prepend函数。示例代码:

$("#E").prepend("<p>Code goes here, yo!</p>");