2012-10-08 15 views
5

में अभी भी मौजूद है मान लें कि मुझे एक घटना के परम के रूप में एक डोम तत्व मिला है, उदाहरण के लिए क्लिक करें।डीओएम से पुनर्प्राप्त तत्व को कैसे जांचें डीओएम

$(document).click(function() { 
    myElement = $(this); 
}); 

मैं बाद में कैसे जांच सकता हूं कि मेरा एलिमेंट अभी भी डोम में है? मैं इस तरह की तरंगदैर्ध्य या किसी अन्य चीज का उपयोग नहीं कर सकता क्योंकि यह अभी भी सहेजे गए तत्व और डीओएम की स्थिति को इस पल में संदर्भित करता है, है ना?

उत्तर

6

आप तत्व माता पिता की जाँच कर सकते हैं:

function isInDom(obj) { 
    var root = obj.parents('html')[0] 
    return !!(root && root === document.documentElement); 
} 


if(isInDom(myElement)) { 
    ... 
} 

यहाँ बेला काम कर रहा है: http://jsfiddle.net/vnxhQ/7/

+0

यह परीक्षण करता है कि क्या तत्व ** ** संग्रहीत होने पर ** माता-पिता थे, इसका कोई संबंध नहीं है कि तत्व अभी भी डोम में है या नहीं। – jbabey

+1

नहीं, यह परीक्षण अब तत्व है कि माता-पिता है। – Inferpse

+0

'myElement' को एक jQuery ऑब्जेक्ट को तत्व को लपेटने की आवश्यकता है, हालांकि .. लेकिन हाँ, मैं इसे नहीं खरीदता हूं कि इसे संग्रहीत किए जाने पर कुछ भी करना है। – JayC

0

आदेश अगर एक तत्व अभी भी डोम में मौजूद है परीक्षण करने के लिए है, तो आप फिर से डोम क्रॉल करने के लिए की जरूरत है:

// store it in some shared scope 
var myElement; 
$(document).click(function() { 
    myElement = $(this); 
}); 

// sometime later... 
if ($('#' + myElement.attr('id')).length > 0) { 
    // it still exists 
} else { 
    // it no longer exists 
} 

आपके क्लिक किए गए तत्वों के पास इस काम के लिए id एस होना चाहिए, हालांकि। इसके बजाय एक वर्ग या किसी अन्य चयनकर्ता का उपयोग किया जा सकता है।

संपादित करें: किसी दिए गए DOM तत्व के लिए अद्वितीय चयनकर्ता कैसे प्राप्त करें, इस पर विचार के लिए this question देखें।

1

यह मानते हुए है आप

var idRef; 
$(document).on('click', function() { 
    idRef = this.id;  
}); 

बाद में सेट संभव 'क्लिक करने योग्य' तत्वों की पहचान के लिए होता है ..

var exists = document.getElementById(idRef).length > 0; 
0

आप एक jQuery वस्तु की गैर-दस्तावेजी .selector संपत्ति एक देखने के लिए कर सकते हैं तत्व अभी भी डीओएम में है, पर यह एक अद्वितीय आईडी का उपयोग करता है। स्पष्ट

http://jsfiddle.net/mblase75/CC2Vn/

$two = $('#two'); 
console.log($($two.selector).length); // 1 
$two.remove(); 
console.log($($two.selector).length); // 0 

कैसे एक jQuery वस्तु है, जो या विशिष्ट डोम तत्व (रों) इसमें वर्णन नहीं हो सकता है के चयनकर्ता पाने के लिए के बारे में अधिक के लिए this question देखें। http://jsfiddle.net/doktormolle/hX8eN/


<edit>

Node.contains() समर्थित किया जा रहा है:

3

केवल विश्वसनीय तरीका मैं अब तक देखते हैं तत्व के अंदर है document.getElementsByTagName('*')

function isInDoc(element) 
{ 
    var elements=document.getElementsByTagName(element.tagName); 
    for(var i=0;i<elements.length;++i) 
    { 
    if(elements[i]===element)return true; 
    } 
    return false; 
} 

डेमो जाँच करने के लिए है सभी प्रमुख ब्राउज़रों द्वारा, तो मैं अंत में sug होगा gest इस:

if(document.documentElement.contains(myElement)) 

डेमो: http://jsfiddle.net/doktormolle/LZUx3/

+0

उह .... वास्तव में? यह बहुत सारे टैग हैं। हो सकता है कि आप इनफेर्से के जवाब को अपने साथ जोड़ सकें 1. यह देखने के लिए परीक्षण करें कि क्या तत्व शरीर टैग से निकलता है या नहीं। 2. यह देखने के लिए परीक्षण करें कि * * * तत्व का बॉडी टैग दस्तावेज़ का बॉडी टैग है या नहीं। – JayC

+0

(या दस्तावेजों में एक से अधिक बॉडी टैग हो सकते हैं ??) – JayC

+0

मेरा मतलब क्या था इसका स्पष्टीकरण के लिए मेरा उत्तर देखें। – JayC

0

बस मैदान में कुछ जोड़ने की:

यह वास्तव में Inferpse का जवाब थोड़ा डॉ के लिए बदलाव किया हैमोल के कोने का एक अन्य शरीर तत्व बनाने का मामला जो सामान्य डीओएम पेड़ से तत्व को हटा सकता है (या, ज़ाहिर है, शायद तत्व पहले स्थान पर कभी भी डोम में नहीं था।) इंफर्सपे के जवाब की तरह, यह एक jQuery लपेटा हुआ ऑब्जेक्ट लेता है, तत्व खुद ही नहीं।

function isInDom(jqobj) { 
    var someBody = jqobj.parents('body'); 
    return someBody.length > 0 && someBody.get(0) === document.body; 
} 
​ 

मुझे स्वीकार करना होगा कि मुझे यह समझने में परेशानी हो रही है कि मैं इसे तोड़ने का प्रयास कैसे कर सकता हूं।

संपादित करें: ओह, हाँ ... jsFiddle: http://jsfiddle.net/vnxhQ/5/

संपादित द्वितीय: जाहिर है, अगर हम (कुछ भी है कि head में जाने सकती है, न body लिंक या स्क्रिप्ट तत्वों के बारे में बात नहीं कर रहे, मुझे लगता है कि ठीक से काम कर सकते हैं: -/

1

शायद एक समारोह Inferpse की को लागू करने की बेहतर तरीका का विस्तार करके है jQuery:

jQuery.fn.extend({ 
    isInDom: function() { 
     var root = this.eq(0).parents('html')[0]; 
     return !!(root && root === document.documentElement); 
    } 
}) 

उपयोग:

$("div").isInDom() //returns true if your dom contains a div 
$("<div />").isInDom() //returns false 
$().isInDom() //returns false 
संबंधित मुद्दे