DOM オブジェクトと JavaScript オブジェクトの違いを見分ける方法は?

DOM オブジェクトと JavaScript オブジェクトを区別する方法

JavaScript を使用する場合、DOM オブジェクトと JavaScript オブジェクトを区別することが重要な場合があります。 DOM オブジェクトは多くの場合、Web ページ上の要素や属性に関連していますが、JavaScript オブジェクトはより抽象的です。

この区別を効率的に実行するには、instanceof 演算子を利用できます。この演算子は、オブジェクトが特定のクラスに属しているか、またはそのクラスから継承されているかを確認するために適用できます。

その使用法を示す例は次のとおりです。

<code class="javascript">function isElement(obj) {
  try {
    // Using W3 DOM2 (compatible with FF, Opera, and Chrome)
    return obj instanceof HTMLElement;
  } catch (e) {
    // For browsers that don't support W3 DOM2 (like IE7)
    return (
      typeof obj === "object" &&
      obj.nodeType === 1 &&
      typeof obj.style === "object" &&
      typeof obj.ownerDocument === "object"
    );
  }
}</code>

あるいは、より包括的なメソッドを実装することもできます。この差別化は、オブジェクトが DOM ノードであるかどうかを検証する新しい関数 isNode() を導入することによって行われます。

<code class="javascript">function isNode(o) {
  return (
    typeof Node === "object" ? o instanceof Node :
    o &&
    typeof o === "object" &&
    typeof o.nodeType === "number" &&
    typeof o.nodeName === "string"
  );
}</code>

この関数を導入すると、isElement() 関数を変更して DOM をチェックできます。要素のみ:

<code class="javascript">function isElement(o) {
  return (
    typeof HTMLElement === "object" ? o instanceof HTMLElement : // DOM2
    o &&
    typeof o === "object" &&
    o !== null &&
    o.nodeType === 1 &&
    typeof o.nodeName === "string"
  );
}</code>

以上がDOM オブジェクトと JavaScript オブジェクトの違いを見分ける方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。