如何在 JavaScript 中确定 DOM 对象状态

在 JavaScript 中，区分 DOM（文档对象模型）对象和常规 JavaScript 对象至关重要对于某些操作。虽然检查 tagName 属性的传统方法在大多数情况下都有效，但在某些不强制执行只读属性的浏览器中可能会失败。

综合解决方案

要解决这个问题，请考虑以下函数：

function isElement(obj) {
  try {
    // W3 DOM2 (works for FF, Opera, and Chrome)
    return obj instanceof HTMLElement;
  } catch (e) {
    // Non-DOM2 browsers
    return (
      typeof obj === 'object' &&
      obj.nodeType === 1 &&
      typeof obj.style === 'object' &&
      typeof obj.ownerDocument === 'object'
    );
  }
}

此代码利用 W3 DOM2 支持的浏览器，并检查非 DOM2 浏览器中的特定属性。

其他选项

另一种方法是使用以下代码：

function isNode(o) {
  return typeof Node === 'object'
    ? o instanceof Node
    : o &&
        typeof o === 'object' &&
        typeof o.nodeType === 'number' &&
        typeof o.nodeName === 'string';
}

function isElement(o) {
  return typeof HTMLElement === 'object'
    ? o instanceof HTMLElement
    : o &&
        typeof o === 'object' &&
        o !== null &&
        o.nodeType === 1 &&
        typeof o.nodeName === 'string';
}

此代码区分 DOM 节点和元素，解决浏览器实现中的潜在差异。