İşte bazı örnek kodlar:

function addTextNode(){
    var newtext = document.createTextNode(" Some text added dynamically. ");
    var para = document.getElementById("p1");
    para.appendChild(newtext);
    $("#p1").append("HI");
}

<div style="border: 1px solid red">
    <p id="p1">First line of paragraph.<br /></p>
</div>

Arasındaki fark nedir append()ve appendChild()?
Herhangi bir gerçek zamanlı senaryo var mı?

Temel fark, appendChildbir DOM yöntemi ve appendbir jQuery yöntemi olmasıdır. İkincisi, jQuery kaynak kodunda görebileceğiniz gibi birincisini kullanır

append: function() {
    return this.domManip(arguments, true, function( elem ) {
        if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
            this.appendChild( elem );
        }
    });
},

Projenizde jQuery kitaplığı kullanıyorsanız append, sayfaya öğe eklerken her zaman güvenli olacaksınız .

Artık

şimdi eklemek JavaScript'te bir yöntemdir

Ekleme yöntemiyle ilgili MDN belgeleri

MDN'den alıntı yapmak

ParentNode.appendDüğüm nesneleri ya da yöntemi, bir dizi ekler DOMStringson çocuk sonra nesneler ParentNode. DOMStringnesneler eşdeğer Metin düğümleri olarak eklenir.

Bu, IE ve Edge tarafından desteklenmez ancak Chrome (54+), Firefox (49+) ve Opera (39+) tarafından desteklenir.

JavaScript'in eki, jQuery'nin ekine benzer.

Birden çok argüman iletebilirsiniz.

var elm = document.getElementById('div1');
elm.append(document.createElement('p'),document.createElement('span'),document.createElement('div'));
console.log(elm.innerHTML);

<div id="div1"></div>

append bir öğeye bazı içerik veya HTML eklemek için bir jQuery yöntemidir.

$('#example').append('Some text or HTML');

appendChild alt öğe eklemek için saf bir DOM yöntemidir.

document.getElementById('example').appendChild(newElement);

Bunun eski ve cevaplanmış bir soru olduğunu biliyorum ve oy aramıyorum, sadece yeni gelenlere yardımcı olabileceğini düşündüğüm ekstra küçük bir şey eklemek istiyorum.

yes appendChildbir DOMyöntemdir ve appendJQuery yöntemidir ancak pratikte temel fark, appendChildbir düğümü parametre olarak almasıdır , yani DOM'a boş bir paragraf eklemek istiyorsanız, pönce o öğeyi oluşturmanız gerekir

var p = document.createElement('p')

daha sonra bunu DOM'a ekleyebilirsiniz, JQuery appendbu düğümü sizin için oluşturur ve ister bir metin öğesi, ister bir html öğesi veya bir kombinasyon olsun, onu hemen DOM'a ekler!

$('p').append('<span> I have been appended </span>');

appendChildbir DOM vanilla-js işlevidir.

append bir jQuery işlevidir.

Her birinin kendi tuhaflıkları var.

appendChildBir saf JavaScript gibi bir yöntem appenda, jQuery yöntemi.

JavaScript AppendChild yöntemi başka elemana bir öğe eklemek için kullanmak olabilir. JQuery ekleme elemanı aynı işi ama kesinlikle hatlarının daha az sayıda yapar:

Listeye bir öğe eklemek için bir örnek alalım:

a) JavaScript ile

var n= document.createElement("LI");                 // Create a <li> node
var tn = document.createTextNode("JavaScript");      // Create a text node
n.appendChild(tn);                                   // Append the text to <li>
document.getElementById("myList").appendChild(n);  

b) jQuery ile

$("#myList").append("<li>jQuery</li>")