2012-04-02 19 views
9

मैं निम्नलिखित तत्व है कहोकंसोल में ऑब्जेक्ट टेक्स्ट के रूप में किस तरह का ऑब्जेक्ट दिखाई देता है? मैं jQuery के साथ इसकी सामग्री मिल जाएगा</p> <pre><code><p id="thingy">Here is some <em>emphasized</em> text!</p> </code></pre> <p>एक Javascript कंसोल में,:

:

> var theContents = $('<p id="thingy">Here is some <em>emphasized</em> text!</p>').contents(); 

theContents अब एक सरणी है कि इस तरह दिखता है है

> theContents 
["Here is some ", <em>​emphasized​</em>​, " text!"] 

अब तक इतना अच्छा है; यह एक सरणी प्रतीत होता है, जहां तत्व 0 और 2 स्ट्रिंग हैं, और तत्व 1 एक jQuery ऑब्जेक्ट है। मैं उत्पादन सिर्फ पहला तत्व है, यह मेरा अनुमान पुष्टि करने के लिए लगता है:

> theContents[0] 
"Here is some " 

हालांकि, अगर मैं एक तार के साथ यह श्रेणीबद्ध करने की कोशिश, मुझे लगता है कि मैं कुछ समझ की कमी कर रहा हूँ:

> 'Hello! ' + contents[0]; 
"Hello! [object Text]" 

तो वह चर एक स्ट्रिंग की तरह दिखता है, लेकिन वास्तव में यह किसी प्रकार की वस्तु है। उस मामले के लिए, मध्य में jQuery ऑब्जेक्ट नियमित ऑब्जेक्ट के रूप में दिखाई नहीं देता है, या तो; यह कच्चे मार्कअप के रूप में दिखाई देता है।

Another question एक ही समस्या का संदर्भ देता है, लेकिन वास्तव में इसे स्पष्ट नहीं करता है। मैंने पाया है कि मैं अपनी वास्तविक समस्या को हल करने के लिए contents[0].textContent का उपयोग कर सकता हूं, लेकिन यह अभी भी मुझे यह समझने में सहायता नहीं करता है कि यहां क्या हो रहा है। क्या कोई मुझे विस्तार से समझा सकता है कि यह सब किस तरह से व्यवहार कर रहा है?

उत्तर

10

अधिकांश jQuery फ़ंक्शन jQuery object लौटाते हैं, जो सुविधा के लिए अधिकांश उद्देश्यों के लिए एक सरणी की तरह दिखता है और काम करता है। प्रलेखन को उद्धृत करने के लिए, "एक jQuery ऑब्जेक्ट में दस्तावेज़ ऑब्जेक्ट मॉडल (डीओएम) तत्वों का संग्रह होता है" (या "नोड्स")। तो आप मान सकते हैं कि संग्रह का प्रत्येक सदस्य एक डोम नोड है, एक स्ट्रिंग नहीं है, और तदनुसार आप जिस ऑब्जेक्ट को देख रहे हैं वह Text node है।

जावास्क्रिप्ट में जब आप स्ट्रिंग कॉन्सटेनेशन करते हैं तो प्रत्येक ऑपरेंड जो एक स्ट्रिंग नहीं है स्वचालित रूप से toString() विधि को कॉल करके स्वचालित रूप से परिवर्तित हो जाती है। तो, जैसा कि "1,2,3" सरणी [1, 2, 3] और "[object HTMLDivElement]" का स्ट्रिंग प्रस्तुति HTML "<div>", "[object Text]" के साथ बनाए गए नोड का प्रतिनिधित्व करता है, एक टेक्स्ट नोड का प्रतिनिधित्व करता है।

आप read the specification here कर सकते हैं। चूंकि इंटरफ़ेस टेक्स्ट कैरेक्टरडाटा से विरासत में आता है, इसलिए इसमें data संपत्ति होती है जिसमें स्ट्रिंग स्वयं होती है। और इसलिए:

var theContents = $('<p id="thingy">Here is some <em>emphasized</em> text!</p>') 
        .contents(); 

console.log(theContents[0].data); 
// => "Here is some " 

console.log("Hello! " + theContents[0].data); 
// => "Hello! Here is some " 
+1

+1: एक त्वरित छोटा प्रदर्शन: http://jsfiddle.net/fwysq/2/ –

0

डोम में विभिन्न प्रकार के नोड हैं। तत्व नोड्स, नोड्स गुण, पाठ नोड्स आदि

आपका <p> टैग DOM संरचना वास्तव में लग रहा है और अधिक की तरह

Element Node [p] 
    ->Text Node [Here is some ] 
    ->Element node [em] 
    ->Text Node [emphasized] 
    ->Text Node [text!] 

से कुछ अधिक jQuery पेज से DOM संरचना को बनाए रखना क्रम में बेहतर तत्वों के हेरफेर की अनुमति के लिए अपने

संबंधित मुद्दे