如何检查可见DOM中是否存在元素？
如何在不使用getElementById方法的情况下testing存在的元素？ 我已经安装了一个现场演示供参考。 我也将在这里打印代码：
<!DOCTYPE html> <html> <head> <script> var getRandomID = function (size) { var str = "", i = 0, chars = "0123456789abcdefghijklmnopqurstuvwxyzABCDEFGHIJKLMNOPQURSTUVWXYZ"; while (i < size) { str += chars.substr(Math.floor(Math.random() * 62), 1); i++; } return str; }, isNull = function (element) { var randomID = getRandomID(12), savedID = (element.id)? element.id : null; element.id = randomID; var foundElm = document.getElementById(randomID); element.removeAttribute('id'); if (savedID !== null) { element.id = savedID; } return (foundElm) ? false : true; }; window.onload = function () { var image = document.getElementById("demo"); console.log('undefined', (typeof image === 'undefined') ? true : false); // false console.log('null', (image === null) ? true : false); // false console.log('find-by-id', isNull(image)); // false image.parentNode.removeChild(image); console.log('undefined', (typeof image === 'undefined') ? true : false); // false ~ should be true? console.log('null', (image === null) ? true : false); // false ~ should be true? console.log('find-by-id', isNull(image)); // true ~ correct but there must be a better way than this? }; </script> </head> <body> <div id="demo"></div> </body> </html>
基本上上面的代码演示了一个元素被存储到一个variables，然后从DOM中删除。 即使该元素已经从dom中删除，variables保留元素，因为它是在第一次宣布时。 换句话说，它不是元素本身的生动参考，而是一个副本。 因此，检查variables的值（元素）是否存在将会提供意想不到的结果。
isNull函数是我试图从一个variables检查元素的存在，它的工作原理，但我想知道是否有一个更简单的方法来完成相同的结果。
PS：我也很感兴趣的是，如果有人知道有关这个主题的一些好的文章，JavaScriptvariables的行为就像这样。
似乎有些人在这里登陆，只是想知道一个元素是否存在 （与原来的问题有点不同）。
这就像使用浏览器的select方法一样简单，并检查它的真值（通常）。
例如，如果我的元素有一个"find-me"的id ，我可以简单地使用…
var elementExists = document.getElementById("find-me");
这被指定为返回元素的引用或null 。 如果你必须有一个布尔值，只需折腾!! 在方法调用之前。
另外，你可以使用现有的其他一些方法来查找元素，例如（全部以document为生）：
-
querySelector()/querySelectorAll() -
getElementsByClassName() -
getElementsByName()
其中一些方法返回一个NodeList ，所以一定要检查它的length属性，因为NodeList是一个对象，因此truthy 。
为了实际确定一个元素是否作为可见DOM的一部分存在（就像最初提出的问题一样）， Csuwldcat提供了一个比滚动自己的更好的解决scheme （就像这个答案用来包含）。 也就是说，要在DOM元素上使用contains()方法。
你可以像这样使用它…
document.body.contains(someReferenceToADomElement);
如果可用，为什么不使用getElementById() ？
另外，这里有一个简单的方法来做到这一点与jQuery：
if ($('#elementId').length > 0) { // exists. }
如果你不能使用第三方库，只需坚持基于JavaScript：
var element = document.getElementById('elementId'); if (typeof(element) != 'undefined' && element != null) { // exists. }
使用Node.contains DOM API ，您可以很容易地检查页面中的任何元素（当前在DOM中）的存在：
document.body.contains(YOUR_ELEMENT_HERE);
浏览器注意 ：IE中的document对象没有contains()方法 – 为了确保跨浏览器的兼容性，使用document.body.contains()来代替
我只是做：
if(document.getElementById("myElementId")){ alert("Element exists"); } else { alert("Element does not exist"); }
适用于我，并没有问题，但呢….
从Mozilla开发者networking
这个函数检查一个元素是否在页面的主体中。 As contains是包含性的，并且确定body是否包含它本身并不是isInPage的意图，这种情况显然返回false。
function isInPage(node) { return (node === document.body) ? false : document.body.contains(node); }
节点是我们要检查的节点。
最简单的解决scheme是检查baseURI属性，该属性仅在元素插入到DOM中时设置，并在删除时恢复为空string。
你能否检查一下parentNode属性是否为null？
即
if(!myElement.parentNode) { //node is NOT on the dom } else { //element is on the dom }
csuwldcat的解决scheme似乎是最好的，但需要做一些细微的修改，使其能够正确处理与javascript运行在不同文档中的元素，比如iframe：
YOUR_ELEMENT.ownerDocument.body.contains(YOUR_ELEMENT);
请注意元素的ownerDocument属性的使用，而不仅仅是普通的ol document （可能或不可能引用元素的所有者文档）。
torazaburo发布了一个更简单的方法 ，也适用于非本地元素，但不幸的是，它使用了baseURI属性，目前在浏览器中并没有统一实现（我只能在基于webkit的方法中使用它）。 我找不到任何其他元素或节点属性可以用类似的方式，所以我认为暂时上面的解决scheme是一样好。
jQuery解决scheme：
if ($('#elementId').length) { // element exists, do something... }
这对我使用jQuery，并不需要使用$('#elementId')[0] 。
我喜欢这个方法
var elem = document.getElementById('elementID'); if( elem )do this else do that
也
var elem = ((document.getElementById('elemID')) ? true:false); if( elem ) do this else do that
简单的解决scheme与jQuery
$('body').find(yourElement)[0] != null
你也可以使用jQuery.contains ，它检查一个元素是否是另一个元素的后代。 我传入document作为父元素进行search，因为页面DOM上存在的任何元素都是document的后代。
jQuery.contains( document, YOUR_ELEMENT)
