jQuery要素がDOMにあるかどうかを確認するにはどうすればよいですか？

要素を定義するとしましょう

$foo = $('#foo');

そして私は電話します

$foo.remove()

いくつかのイベントから。私の質問は、$ fooがDOMから削除されたかどうかを確認するにはどうすればよいですか？私はそれが$foo.is(':hidden')機能することを発見しましたが、もちろん、単にを呼び出し$foo.hide()ただけでもtrueを返します。

このような：

if (!jQuery.contains(document, $foo[0])) {
    //Element is detached
}

これは、要素の親の1つが削除された場合でも機能します（その場合、要素自体にはまだ親があります）。

これはどうですか：

$element.parents('html').length > 0

質問を入力しているときに答えがわかりました：電話

$foo.parent()

場合は$f00、その後、DOMから削除されました$foo.parent().length === 0。それ以外の場合、その長さは少なくとも1になります。

[編集：削除された要素は親を持つことができるため、これは完全に正しくはありません。たとえば、を削除しても<ul>、その子にはそれぞれ<li>親があります。代わりにSLaksの回答を使用してください。

コメントとして返信できないので（カルマが少なすぎると思います）、ここで完全な返信を示します。最速の方法は、ブラウザーサポートのjQueryチェックを展開し、一定の要因を最小限に抑えることです。

ここにも見られるように-http://jsperf.com/jquery-element-in-dom/28-コードは次のようになります：

var isElementInDOM = (function($) {
  var docElt = document.documentElement, find,
      contains = docElt.contains ?
        function(elt) { return docElt.contains(elt); } :

        docElt.compareDocumentPosition ?
          function(elt) {
            return docElt.compareDocumentPosition(elt) & 16;
          } :
          ((find = function(elt) {
              return elt && (elt == docElt || find(elt.parentNode));
           }), function(elt) { return find(elt); });

  return function(elt) {
    return !!(elt && ((elt = elt.parent) == docElt || contains(elt)));
  };
})(jQuery);

これは、意味的にjQuery.contains（document.documentElement、elt [0]）と同等です。

おそらく最もパフォーマンスの高い方法は次のとおりです。

document.contains(node); // boolean

これはjQueryでも機能します。

document.contains($element[0]); // var $element = $("#some-element")
document.contains(this[0]); // in contexts like $.each(), `this` is the jQ object

MDNからのソース

注意：

• Internet Explorer contains()は要素のみをサポートしています。

私はこのアプローチが好きでした。jQueryもDOM検索もありません。最初に最上位の親（祖先）を見つけます。次に、それがdocumentElementかどうかを確認します。

function ancestor(HTMLobj){
  while(HTMLobj.parentElement){HTMLobj=HTMLobj.parentElement}
  return HTMLobj;
}
function inTheDOM(obj){
  return ancestor(obj)===document.documentElement;
}

親を反復する代わりに、要素がdomからデタッチされるときにすべて0である境界矩形を取得できます

function isInDOM(element) {
    var rect=element.getBoundingClientRect();
    return (rect.top || rect.bottom || rect.height || rect.width)?true:false;
}

幅0と高さ0の要素が上端ゼロ、左端ゼロであるエッジケースを処理する場合は、document.bodyまで親を反復して再確認できます。

ペロのコメントに同意する。次のように行うこともできます：

$foo.parents().last().is(document.documentElement);

jQuery.fn.isInDOM = function () {
   if (this.length == 1) {
      var element = this.get(0);
      var rect = element.getBoundingClientRect();
      if (rect.top + rect.bottom + rect.width + rect.height + rect.left + rect.right == 0)
         return false;
      return true;
   }
   return false;
};

なぜだけではないの if( $('#foo').length === 0)...ですか？

if($foo.nodeType ){ element is node type}