检查缓存的jquery对象是否仍在DOM中

Question

有谁知道如何判断缓存的jQuery对象是否已过时,例如不再在DOM中？例如:

var $cached_elem = $('.the_button');

// .. and then later

$cached_elem.text('updating...');

我最近遇到了由于某些其他事件而从DOM中删除$ cached_elem的情况.那么我想做什么:

if ( $cache_elem.isStillInDOM() ){
  // now do time consuming stuff with $cached_elem in DOM 
}

在任何人提供之前,我已经使用过这个,这对于我正在尝试做的事情来说是公平的模拟:

if ( $cached_elem.is(':visible') === true ){ ... }

但是,这并不是一回事,在某些情况下可能会失败.

那么,任何人都可以想到一个简单的方法来直接检查缓存的jQuery对象是否"陈旧"？如果不是,我可能会被迫写一个插件......

Answer 1

if($elem.closest('body').length > 0) 好像它可以做到这一点.

$(function() {
    var $button = $(".the_button");
    alert (isStale($button));
    $button.remove();
    alert (isStale($button));
});
    
function isStale($elem)
{
    return $elem.closest("body").length > 0;
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <span class="the_button">Hello World</span>
</div>

编辑:更新以响应易江的评论,以便在删除其父元素时它将正确返回

编辑2:更新以响应lonesomeday的评论 - 更改parents()为'nearest()`以提高性能

Answer 2

本机document.contains()方法应该比jQuery更快,以确定DOM中是否存在缓存的jQuery元素.

if (document.contains($cached_elem[0])) {
    // Element is still in the DOM
}