एक खाली, गैर-शून्य jQuery ऑब्जेक्ट को कैसे संलग्न करने के लिए तैयार करें?

Question

मैं कुछ एचटीएमएल को केवल खाली लूप में एक खाली गैर शून्य jQuery ऑब्जेक्ट में जोड़ना चाहता हूं लेकिन यह तब तक काम नहीं कर रहा है जब तक कि मैं ऑब्जेक्ट नहीं बनाता और सृजन के दौरान एक HTML टैग जोड़ता हूं। मैं एक खाली jQuery ऑब्जेक्ट कैसे बना सकता हूं और बाद में इसे HTML में जोड़ने में सक्षम हूं?

//var $new = $().add(""); //can't use this object in the loop 
//var $new = $([]);  //can't use this object in the loop 
//var $new = $();  //can't use this object in the loop 
//var $new = $("#nonexistingelement"); //can't use this object in the loop 
var $new = $().add("<tr>"); //works but I don't want to add any html at this point. 

$.each(.....) 
    { 
    $new.append("<sometag>"); 

}); 

alert($new.html()); //should display some html 

अलावा: http://jsfiddle.net/vfPNT/

Answer 1

मुझे कोई और रास्ता नहीं मिला, इसलिए मैंने <tr> से शुरुआत की। सामग्री को रखते हुए <tr> को हटाकर ठीक से काम नहीं किया गया और इसलिए मैंने सवाल पोस्ट किया। इसलिए, इसके बजाय, मैंने सभी <sometag>'s which were inside the <tr> का चयन करके एक नया jQuery चयन बनाया और $ नया फेंक दिया।

var $new = $().add("<tr>"); 

$.each(.....) 
    { 
    $new.append("<sometag>"); 

}); 
$new.append("</tr>"); 
$newObject = $('sometagt', $new) 
..... do more work using $newObject 

Answer 2

आपका वस्तु $new एक खाली चयनकर्ता है, इसलिए append कोई सेट करने के लिए संलग्न करने के लिए है।

add को एक डोम नोड जोड़ने की आवश्यकता है, और फिर आप उन डोम नोड्स में शामिल होते हैं। ऐसा नहीं लगता कि आप .add से शुरू करने से बच सकते हैं।

Answer 3

आपकी समस्या यह है कि "शून्य" jQuery ऑब्जेक्ट्स नहीं हैं जिन्हें जोड़ा जा सकता है और "खाली" हो सकता है। आप पहले से ही खाली बनाने के कई तरीकों की पहचान कर चुके हैं, और जब भी अधिक हो, इससे कोई फर्क नहीं पड़ता - आप जो भी करने की कोशिश कर रहे हैं वह वह नहीं करेगा जो आप उम्मीद करते हैं, कोई फर्क नहीं पड़ता कि आप शुरू करें, क्योंकि ...

... append() डीओएम को संशोधित करता है, jQuery ऑब्जेक्ट नहीं। और एक खाली jQuery ऑब्जेक्ट में कोई DOM नहीं है! Tomalak had the right idea, हालांकि आप इसे समझ नहीं सकते हैं।

मैं jQuery के बारे में तीन टिप्पणियों कि आप शायद पहले से ही पता चल सके बनाने के लिए जा रहा हूँ, लेकिन जो इस उत्तर के शेष को समझने में उपयोगी होते हैं और इसलिए भविष्य पाठकों को लाभ हो सकता है:

1. एक jQuery वस्तु मूल रूप से डीओएम तत्वों के सेट है।
2. कुछ jQuery विधियां सेट पर काम करती हैं, और कुछ पर सेट पर नोड्स पर काम करती हैं।
3. कुछ jQuery विधियां सेट पर जोड़े गए पहले नोड पर केवल (या केवल जानकारी पुनर्प्राप्त करें) पर संचालित होती हैं।

मन में इन तीन टिप्पणियों के साथ

, के अपने उदाहरण पर विचार करें:

// 1. create an empty set somehow (doesn't matter how) 
var $new = $(); 

// 2. iterate over something 
$.each(..., function(...) 
{ 
    // 3. construct a DOM fragment from HTML, and append it 
    $new.append("<sometag>"); 
}); 

// 4. try to display HTML corresponding to the jQuery object 
alert($new.html()); 

इस उदाहरण में, कदम # 3 कुछ भी उपयोगी करने के लिए असफल हो जायेगी क्योंकि append() के प्रयोजन के लेने के लिए है जो कुछ भी डोम यह तत्व उन्हें सेट में प्रत्येक डोम तत्व के लिए बच्चों के रूप में दिया जाता है और उन्हें जोड़ दिया जाता है। चूंकि $newखाली सेट है, इसमें कोई तत्व नहीं है, और ... कुछ भी नहीं होता है। चरण # 1 ठीक काम कर रहा है - लेकिन इसमें किसी भी DOM तत्वों के बिना सेट बनाकर, आपने स्वयं को विफल करने के लिए सेट अप किया है जब आप DOM को संशोधित करने के लिए मौजूद विधियों का उपयोग करने का प्रयास करते हैं! संदर्भ निरीक्षण # 2 ... सेट को संशोधित करने के लिए, आपको एक विधि को कॉल करने की आवश्यकता है जो वास्तव में सेट पर संचालित करता है।

ठीक है, तो चलो कहते हैं कि हम सेट संशोधन का उपयोग करते हैं विधि add() बजाय:

$new = $new.add("<sometag>"); 

अब हम अच्छा, है न? लूप के माध्यम से प्रत्येक पास एक नया jQuery ऑब्जेक्ट तैयार करेगा जिसमें पिछले सेट + एक नव निर्मित तत्व शामिल होगा। खैर ...

... यह सिर्फ कुछ अजीब करने के लिए कदम # 4 का कारण होगा। देखें, html() उन तरीकों मैं अवलोकन # 3 में वर्णित में से एक है - यह केवल सेट में पहला तत्व पर चल रही है। तो अनुक्रम की बजाय ("<sometag><sometag><sometag>...") आपको केवल लूप ("<sometag>") के माध्यम से पहले पास पर बनाए गए तत्व का HTML प्रतिनिधित्व प्राप्त होगा। सिवाय ... तुम भी कि प्राप्त करने के लिए, क्योंकि html() तत्व के बच्चों का प्रतिनिधित्व बनाता है नहीं जा रहे हैं - तो आप क्या कर रहे हैं वास्तव में अंत करने के लिए जा "" है ...

यह सब सिर्फ एक बड़ा निराशा थी: यदि आप सेट के साथ काम शुरू कर दिया (चरण # 1), तो (चरण # 3), और एक DOM एलीमेंट से डेटा खींचने की कोशिश कर से समाप्त (कि डोम पर काम करने की कोशिश की अस्तित्व में नहीं था) (और अगर ऐसा होता तो कोई डेटा नहीं होता) (चरण # 4)।

The solution you finally came up with भयानक नहीं है - आप अनिवार्य रूप से शुरू करने के लिए सेट एक मूल तत्व जोड़ सकते हैं और जब तक आप नए तत्वों को जोड़ने काम हो गया और उन पर काम करने के लिए तैयार कर रहे हैं इस डोम टुकड़ा पर पूरी तरह से संचालित करने के लिए चुन रहे । आपने इसे अपने संशोधित उदाहरण से छोड़ा है, लेकिन html() भी काम करेगा, क्योंकि यह आपके रूट तत्व की सामग्री को बस डंप करेगा।

लेकिन अभी पूरा करने के लिए, मैं तुम्हें एक अंतिम उदाहरण है कि पर काम करता है दे देंगे सेट, एक खाली jQuery वस्तु के साथ शुरू:

var $new = $(); 
$.each([1, 2, 3, 4], function(i, v) 
{ 
    $new = $new.add("<div>"); 
}); 

alert($new.length == 4); // true 

// alerts: <div></div><div></div><div></div><div></div> 
alert($("<div>").append($new).html()); 

Answer 4

मैं ऊपर समाधान testet लेकिन यह काम नहीं किया मेरे लिए, यह हमेशा खाली jQuery वस्तु के रूप में चलता रहा ...

अगर दिलचस्पी किसी को भी, यहाँ मेरी समाधान है:

var jQueryElements = [], 
    $new; 

$.each([1, 2, 3, 4], function(i, v){ 
    jQueryElements = jQueryElements.push($('<div>').get(0)); 
}); 

$new = $(jQueryElements); 

Answer 5

दस्तावेज़ टुकड़े पे कर रहे हैं इसके लिए दोष; संलग्न करने के लिए तैयार एक खाली वस्तु बनाता है। :)

$(document.createDocumentFragment())