JavaScript オブジェクトが DOM 要素であるかどうかを確実に判断するにはどうすればよいでしょうか?

JavaScript オブジェクトが DOM オブジェクトであるかどうかを判断する方法

JavaScript を使用する場合、多くの場合、オブジェクトが DOM オブジェクトであるかどうかを判断する必要があります。 DOM (ドキュメント オブジェクト モデル) 要素。この区別は、ユーザー インタラクションの処理、ページ要素の操作、および適切な機能の確保にとって重要です。

一般的なアプローチの 1 つは、オブジェクトに tagName プロパティがあるかどうかを確認することです。ただし、この方法は、DOM 要素が常にこのプロパティを持っていると想定しているため、誤りがあり得ます。この問題に完全に対処するには、より堅牢なソリューションが必要です。

推奨される解決策

1 つの代替案は、instanceof HTMLElement チェックを提供する W3 DOM2 仕様を活用することです。このアプローチは、Firefox、Opera、Chrome などのブラウザでうまく機能します。

W3 DOM2 をサポートしていないブラウザの場合は、より包括的なアプローチをお勧めします。

function isElement(obj) {
  try {
    return obj instanceof HTMLElement;
  } catch(e) {
    return (typeof obj === "object") &&
      (obj.nodeType === 1) &&
      (typeof obj.style === "object") &&
      (typeof obj.ownerDocument === "object");
  }
}

このコードは次のことをテストします。すべての DOM 要素に共通のプロパティを使用して、信頼性の高い決定を保証します。

代替実装

もう 1 つのアプローチは、DOM ノードと DOM 要素の両方に個別の関数を定義することです。

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 内のノードと要素の両方に対する特定の要件に応じて、より洗練されたチェックを提供します。

以上がJavaScript オブジェクトが DOM 要素であるかどうかを確実に判断するにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。