jQuery के परिशिष्ट () बनाम परिशिष्ट ()

Question 1

यहाँ कुछ नमूना कोड दिया गया है:

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>

बीच क्या अंतर है append()और appendChild()?
किसी भी वास्तविक समय परिदृश्यों?

Question 2

मुख्य अंतर यह है कि appendChildएक DOM विधि है और appendएक jQuery विधि है। दूसरा वाला पहले का उपयोग करता है जैसा कि आप jQuery के सोर्स कोड पर देख सकते हैं

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

यदि आप अपने प्रोजेक्ट पर jQuery लाइब्रेरी का उपयोग कर रहे हैं, तो appendपृष्ठ में तत्वों को जोड़ते समय आप हमेशा सुरक्षित रहेंगे ।

Question 3

अब और नहीं

अब एपेंड जावास्क्रिप्ट में एक विधि है

परिशिष्ट विधि पर एमडीएन प्रलेखन

एमडीएन का हवाला देते हुए

ParentNode.appendविधि एक सेट सम्मिलित करता है नोड वस्तुओं या के DOMStringके अंतिम बच्चे की वस्तुओं ParentNode। DOMStringऑब्जेक्ट्स को समतुल्य टेक्स्ट नोड्स के रूप में डाला जाता है।

यह IE और एज द्वारा समर्थित नहीं है लेकिन क्रोम (54+), फ़ायरफ़ॉक्स (49+) और ओपेरा (39+) द्वारा समर्थित है।

जावास्क्रिप्ट का परिशिष्ट jQuery के परिशिष्ट के समान है।

आप कई तर्क पारित कर सकते हैं।

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

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

स्निपेट का विस्तार करें

Question 4

append एक तत्व के लिए कुछ सामग्री या HTML को जोड़ने के लिए एक jQuery विधि है।

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

appendChild एक बाल तत्व जोड़ने के लिए एक शुद्ध डोम विधि है।

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

Question 5

मुझे पता है कि यह एक पुराना और उत्तर दिया गया प्रश्न है और मैं उन मतों की तलाश नहीं कर रहा हूँ जिन्हें मैं केवल एक अतिरिक्त छोटी चीज जोड़ना चाहता हूं जो मुझे लगता है कि नए लोगों की मदद कर सकता है।

हाँ appendChildएक DOMतरीका है और appendJQuery विधि है, लेकिन व्यावहारिक रूप से महत्वपूर्ण अंतर यह है कि appendChildएक नोड को एक पैरामीटर के रूप में लिया जाता है, मेरा मतलब है कि यदि आप DOM में एक खाली पैराग्राफ जोड़ना चाहते हैं, तो आपको pपहले उस तत्व को बनाने की आवश्यकता है

var p = document.createElement('p')

तब आप इसे DOM में जोड़ सकते हैं जबकि JQuery appendआपके लिए वह नोड बनाता है और इसे DOM में तुरंत जोड़ता है चाहे वह टेक्स्ट एलिमेंट हो या html एलिमेंट या कोई कॉम्बिनेशन!

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

Question 6

appendChildएक डोम वेनिला-जेएस फ़ंक्शन है।

append एक jQuery फ़ंक्शन है।

उनमें से प्रत्येक की अपनी-अपनी क़ुर्बानी है।

Question 7

appendChildएक शुद्ध जावास्क्रिप्ट विधि है जहाँ appendएक jQuery विधि है।

Question 8

जावास्क्रिप्ट appendChild विधि एक और तत्व के लिए एक आइटम संलग्न करने के लिए इस्तेमाल किया जा सकता। JQuery संलग्न तत्व एक ही काम है लेकिन निश्चित रूप लाइनों की कम संख्या में करता है:

आइए एक सूची में एक आइटम को जोड़ने के लिए एक उदाहरण लें:

क) जावास्क्रिप्ट के साथ

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 के साथ

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