2014-10-27 7 views
5

विकि में डोम घटनाओं के अनुसार in the wiki link here,DOMNodeInserted और DOMNodeInsertedIntoDocument के बीच क्या अंतर है?

DOMNodeInserted पाया: आग जब एक नोड एक और नोड

DOMNodeInsertedIntoDocument के एक बच्चे के रूप में जोड़ा गया है: आग जब एक नोड एक दस्तावेज़ में सम्मिलित किया जा रहा है

अब वास्तविक अंतर क्या है? क्या दोनों घटनाएं समान नहीं होनी चाहिए? यदि नहीं और कहाँ इस्तेमाल किया जाना चाहिए?

परिदृश्य जहां मैं उपर्युक्त डीओएम घटनाओं का उपयोग कर रहा हूं वह यह है कि, मेरे पास पृष्ठों का एक सेट है और प्रत्येक पृष्ठ नेविगेशन के लिए आरक्षित एक div के अंदर nav.jsp फ़ाइल लोड करता है। अब मैं वर्तमान पृष्ठ के एनवी टैब को हाइलाइट करना चाहता हूं इसलिए मैं इसे डीओएम तत्व (एनवी डीआईवी) लोड होने के बाद एक छोटी पृष्ठभूमि संपत्ति देता हूं।

मेरी समस्या

$(document).on('DOMNodeInserted', function(e) { 
     if(e.target.id=="navigate"){ 
     //........... 
     } 
}); 

के लिए

अब काम किया, लेकिन सिर्फ उत्सुक क्या अंतर है मेरे सवाल में निर्दिष्ट दो घटनाओं के बीच है।

+2

'उत्परिवर्तन' के पक्ष में 'उत्परिवर्तन' [बहिष्कृत] (http://www.w3.org/TR/2014/WD-DOM-Level-3-Events-20140925/#glossary-deprecated) से अवगत रहें 'रों। [Spec] में चेतावनी देखें (http://www.w3.org/TR/2014/WD-DOM-Level-3-Events-20140925/#legacy-mutationevent-events)। – Oriol

उत्तर

4

DOMNodeInsertedIntoDocument घटना DOMNodeInserted घटना के समान है, लेकिन ऐसा तब होता है जब दस्तावेज़ में कोई नोड डाला जाता है।

उदाहरण के लिए, यदि दस्तावेज़ में कोई नोड जोड़ा गया है जो दस्तावेज़ का हिस्सा नहीं है, तो DOMNodeInserted ईवेंट निकाल दिया गया है लेकिन DOMNodeInsertedIntoDocument ईवेंट नहीं है। यदि दस्तावेज़ में नोड का मूल तत्व डाला गया है, तो DOMNodeInsertedIntoDocument ईवेंट निकाल दिया गया है लेकिन DOMNodeInserted ईवेंट नहीं है।

JSFiddle देखें: http://jsfiddle.net/ghyga4v6/2/

कोशिश कंटेनर को हटाने जब पाठ नोड अभी भी वहाँ है और देखने के लिए अलग घटनाओं को ट्रिगर करने वाले इसे वापस डालने।

+0

एक कामकाजी बेवकूफ उदाहरण के साथ अच्छी व्याख्या के लिए धन्यवाद। – Sai

0

वे समान नहीं हैं क्योंकि दस्तावेज के बाहर मौजूद नोड में नया नोड जोड़ने के दौरान पहली बार भी आग लगनी चाहिए (बनाया गया है और अभी तक संलग्न नहीं है, या पहले अपने माता-पिता से हटा दिया गया है)।

1

Here're दो लेख आप पढ़ सकते हैं के बारे में

  1. DOMNodeInsertedIntoDocument event
  2. DOMNodeInserted event

उदाहरण के लिए, आप ब्राउज़र एक्सटेंशन के विकास के लिए BOM तत्व में Node सम्मिलित कर सकते हैं कर सकते हैं या इतिहास में हेरफेर।

यानी बीओएम वस्तुओं नेविगेटर, इतिहास, स्क्रीन, स्थान और दस्तावेज जिसमें खिड़की के बच्चे हैं। दस्तावेज़ नोड में डीओएम है, दस्तावेज़ ऑब्जेक्ट मॉडल, जो पृष्ठ की सामग्री का प्रतिनिधित्व करता है। आप जावास्क्रिप्ट का उपयोग करके इसे कुशल बना सकते हैं। (विकी से)

यदि आप सीखना जारी रखना चाहते हैं, तो सहायता के लिए यहां एक स्निपेट है।

$(window).on('DOMNodeInsertedIntoDocument', function(){ 
    console.log('DOMNodeInsertedIntoDocument occurred'); 
}); 

$(window).on('DOMNodeInserted', function(){ 
    console.log('DOMNodeInserted occurred'); 
}); 

वैसे, बस आपकी जानकारी के लिए। MutationObserverMutation Events को प्रतिस्थापित कर रहा है।

+0

'उत्परिवर्तन ऑब्सर्वर' ... यह जोड़ने पर अच्छा कॉल है कि यह एक पुराना सवाल है। –

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