Tôi có phần tử E và tôi đang nối thêm một số phần tử vào nó. Thật bất ngờ, tôi phát hiện ra rằng yếu tố tiếp theo nên là đứa con đầu tiên của E. Bí quyết là gì, làm thế nào để làm điều đó? Phương pháp unshift không hoạt động vì E là một đối tượng, không phải là mảng.

Con đường dài sẽ là lặp đi lặp lại những đứa trẻ của E và di chuyển khóa ++, nhưng tôi chắc chắn rằng có một cách đẹp hơn.

var eElement; // some E DOM instance
var newFirstElement; //element which should be first in E

eElement.insertBefore(newFirstElement, eElement.firstChild);

Phiên bản 2017

Bạn có thể dùng

targetElement.insertAdjacentElement('afterbegin', newFirstElement)

Từ MDN :

Phương thức insertAdjighborEuity () chèn một nút phần tử đã cho vào một vị trí nhất định so với phần tử mà nó được gọi.

vị trí
Một DOMString đại diện cho vị trí liên quan đến phần tử; phải là một trong các chuỗi sau
beforebegin:: Trước chính phần tử.
afterbegin: Chỉ bên trong các yếu tố, trước khi đứa con đầu tiên của nó.
beforeend: Chỉ bên trong phần tử, sau đứa con cuối cùng của nó.
afterend: Sau phần tử chính nó.

phần tử
Phần tử được chèn vào cây.

Ngoài ra trong gia đình insertAdjacentcó các phương pháp anh chị em:

element.insertAdjacentHTML('afterbegin','htmlText')để tiêm chuỗi html trực tiếp, thích innerHTMLnhưng không làm quá tất cả mọi thứ, vì vậy bạn có thể nhảy quá trình áp bức document.createElementvà thậm chí xây dựng toàn bộ thành phần với quy trình thao tác chuỗi

element.insertAdjacentTextcho chuỗi khử trùng vào phần tử. không còn nữaencode/decode

Phiên bản 2018

parentElement.prepend(newFirstChild)

Đây là JS hiện đại! Nó dễ đọc hơn các tùy chọn trước đó. Nó hiện có sẵn trong Chrome, FF và Opera.

PS Bạn có thể trực tiếp thêm chuỗi

parentElement.prepend('This text!')

nhà phát triển.mozilla.org

Tôi có thể sử dụng - 94% tháng 5 năm 2020

Polyfill

Bạn có thể thực hiện nó trực tiếp i tất cả các yếu tố html cửa sổ của bạn.
Như thế này :

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

Câu trả lời được chấp nhận được tái cấu trúc thành một hàm:

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

Trừ khi tôi đã hiểu lầm:

$("e").prepend("<yourelem>Text</yourelem>");

Hoặc là

$("<yourelem>Text</yourelem>").prependTo("e");

Mặc dù có vẻ như từ mô tả của bạn rằng có một số điều kiện kèm theo, vì vậy

if (SomeCondition){
    $("e").prepend("<yourelem>Text</yourelem>");
}
else{
    $("e").append("<yourelem>Text</yourelem>");
}

Tôi nghĩ rằng bạn đang tìm kiếm hàm .prepend trong jQuery. Mã ví dụ:

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

Tôi đã tạo nguyên mẫu này để thêm các phần tử vào phần tử cha.

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

var newItem = document.createElement("LI");       // Create a <li> node
var textnode = document.createTextNode("Water");  // Create a text node
newItem.appendChild(textnode);                    // Append the text to <li>

var list = document.getElementById("myList");    // Get the <ul> element to insert a new node
list.insertBefore(newItem, list.childNodes[0]);  // Insert <li> before the first child of <ul>

https://www.w3schools.com/jsref/met_node_insertb Before.asp