संलग्न तत्व से एक jQuery वस्तु प्राप्त करने का आसान तरीका

Question

क्या jQuery के एपेंड का उपयोग करके तत्व को जोड़ने का एक आसान / तेज तरीका है:

$ चयनकर्ता तत्व कैसे प्राप्त करें:

$container.append('<div class="selectors"></div>');
var $selectors = $('.selectors', $container);

मैंने कोशिश की:

var $selectors = $container.append('<div class="selectors"></div>');

लेकिन वह $ चयनकर्ताओं = $ कंटेनर बनाता है

शायद यह सबसे तेज / सबसे अच्छा तरीका है। बस जाँच रहा हूँ।

Answer 1

सिर्फ क्यों नहीं:

var el = $('<div class="selectors"></div>');
$container.append(el);

?

फिर आप 'एल' तक पहुंच सकते हैं।

Comments

हम्म। यदि $containerइस मामले में कई तत्व हैं तो क्या होगा ? मेरे मामले में मैं सभी उदाहरणों के चयनकर्ता मैचों के लिए कुछ जोड़ना चाहता हूं और बनाए गए तत्वों का एक संग्रह प्राप्त करना चाहता हूं।

— Rhys van der Waerden

यह $container jsfiddle.net/onL028ty के कई उदाहरणों पर काम नहीं करेगा । का प्रयोग करें appendToचाल बजाय jsfiddle.net/6nmdh84e

— ktutnik

Answer 2

यह करने का मेरा पसंदीदा तरीका है:

var $selectors = $('<div class="selectors"></div>').appendTo(container);

Comments

+1 - मेरा भी। क्या आपको DOM पर अप्लाई करने से पहले नए बनाए गए एलिमेंट के साथ करना होगा।

— रास कैम

Answer 3

$selectors = $('<div/>').addClass('selectors').appendTo($container);

Comments

अच्छी जानकारी, धन्यवाद। यह अन्य उत्तरों की तुलना में मेरे लिए थोड़ा क्रियात्मक है, लेकिन मुझे आश्चर्य है कि क्या यह बेहतर प्रदर्शन बुद्धिमान है? प्रदर्शन मेरी विशेष स्थिति में एक मुद्दा नहीं है, लेकिन शायद दूसरों के लिए।

— स्लॉफ़लाइफ़

Answer 4

आप इसे करने के लिए एक नया jQuery फ़ंक्शन भी बना सकते हैं:

jQuery.fn.addChild = function(html) 
{                               
    var target  = $(this[0])                            
    var child = $(html);                                                      
    child.appendTo(target);                                                   
    return child;                                                             
};  

और फिर इसे इस तरह उपयोग करें:

$('<ul>').addChild('<li>hi</li>');

यदि आप एक से अधिक आइटम जोड़ना चाहते हैं तो बेशक:

var list = $('<ul>');
list.addChild('<li>item 1</li>');
list.addChild('<li>item 2</li>');

इस तरह के दृष्टिकोणों का लाभ यह है कि बाद में यदि आप चाहें तो "addChild" फ़ंक्शन में अधिक जोड़ सकते हैं। ध्यान दें कि उपरोक्त दोनों उदाहरणों के लिए, आपको दस्तावेज़ में तत्व जोड़ना होगा, इसलिए एक पूर्ण उदाहरण हो सकता है:

$('body').addChild('<ul>').addChild('<li>hi</li>');

Comments

मुझे लगता है कि इस उत्तर का अंतिम भाग केवल भ्रम पैदा करता है; दस्तावेज़ में भाग लेना सवाल का हिस्सा नहीं था। आप इसे क्लेटस की तरह वास्तविक सरल रख सकते हैं और पाठक की कल्पना है कि $ कंटेनर एक उल है। $ कंटेनर.एपेंड ('<li> hi </ li>'); वैसे भी, महान। धन्यवाद।

— माइक एस