这是我的版本。它支持来自iframe的元素

/**
 * @param {any} value
 * @param {any} view Optional. If the value is from an iframe, provide the iframe content window here.
 * @returns {boolean}
 */
function isHtmlElement(value, view) {
  if (value instanceof HTMLElement) return true
  if (view && value instanceof view.HTMLElement) return true

  return !!(
    value &&
    typeof value === 'object' &&
    value !== null &&
    value.nodeType === 1 &&
    typeof value.nodeName === 'string'
  )
}

也许这是另一种选择?在Opera 11, FireFox 6, Internet Explorer 8, Safari 5和谷歌Chrome 16中测试。

function isDOMNode(v) {
  if ( v===null ) return false;
  if ( typeof v!=='object' ) return false;
  if ( !('nodeName' in v) ) return false; 

  var nn = v.nodeName;
  try {
    // DOM node property nodeName is readonly.
    // Most browsers throws an error...
    v.nodeName = 'is readonly?';
  } catch (e) {
    // ... indicating v is a DOM node ...
    return true;
  }
  // ...but others silently ignore the attempt to set the nodeName.
  if ( v.nodeName===nn ) return true;
  // Property nodeName set (and reset) - v is not a DOM node.
  v.nodeName = nn;

  return false;
}

函数不会被例如这个所欺骗

isDOMNode( {'nodeName':'fake'} ); // returns false

检测元素是否属于HTML DOM的最简单的跨浏览器方法如下所示:

function inHTMLDom(myelement){
    if(myelement.ownerDocument.documentElement.tagName.toLowerCase()=="html"){
        return true;
    }else{
        return false;
    }
}

inHTMLDom(<your element>); // <your element>:element you are interested in checking.

在IE6,IE7,IE8,IE9,IE10,FF,Chrome,Safari,Opera中测试。

我有一个特殊的方法来做到这一点，在答案中还没有提到。

我的解决方案基于四个测试。如果对象通过了这四个，那么它就是一个元素:

该对象不是空的。 对象有一个叫做“appendChild”的方法。 方法“appendChild”继承自Node类，而不仅仅是一个冒名方法(具有相同名称的用户创建的属性)。 对象类型为Node Type 1 (Element)。从Node类继承方法的对象总是Node，但不一定是element。

问:如何检查给定的属性是否是继承的，而不是冒名顶替的?

答:要判断一个方法是否真正继承自Node，一个简单的测试是首先验证该属性是否具有“对象”或“函数”类型。接下来，将属性转换为字符串，并检查结果是否包含文本“[Native Code]”。如果结果看起来像这样:

function appendChild(){
[Native Code]
}

然后从Node对象继承了该方法。参见https://davidwalsh.name/detect-native-function

最后，把所有的测试放在一起，解决方案是:

function ObjectIsElement(obj) {
    var IsElem = true;
    if (obj == null) {
        IsElem = false;
    } else if (typeof(obj.appendChild) != "object" && typeof(obj.appendChild) != "function") {
        //IE8 and below returns "object" when getting the type of a function, IE9+ returns "function"
        IsElem = false;
    } else if ((obj.appendChild + '').replace(/[\r\n\t\b\f\v\xC2\xA0\x00-\x1F\x7F-\x9F ]/ig, '').search(/\{\[NativeCode]}$/i) == -1) {
        IsElem = false;
    } else if (obj.nodeType != 1) {
        IsElem = false;
    }
    return IsElem;
}

上面和下面的所有解决方案(包括我的解决方案)都有可能是不正确的，特别是在IE上——(重新)定义一些对象/方法/属性来模拟DOM节点，使测试无效是很可能的。

所以我通常使用duck-typing风格的测试:我专门测试我使用的东西。例如，如果我想克隆一个节点，我这样测试它:

if(typeof node == "object" && "nodeType" in node &&
   node.nodeType === 1 && node.cloneNode){
  // most probably this is a DOM node, we can clone it safely
  clonedNode = node.cloneNode(false);
}

基本上，它是一个小的完整性检查+对我计划使用的方法(或属性)的直接测试。

顺便说一句，上面的测试对于所有浏览器上的DOM节点来说都是一个很好的测试。但是如果您想要安全起见，请始终检查方法和属性的存在并验证它们的类型。

编辑:IE使用ActiveX对象来表示节点，因此它们的属性行为不像真正的JavaScript对象，例如:

console.log(typeof node.cloneNode);              // object
console.log(node.cloneNode instanceof Function); // false

而它应该分别返回“function”和true。测试方法的唯一方法是查看是否定义了方法。

您可以尝试将它附加到一个真正的DOM节点…

function isDom(obj)
{
    var elm = document.createElement('div');
    try
    {
        elm.appendChild(obj);
    }
    catch (e)
    {
        return false;
    }

    return true;
}