DOM オブジェクトと JavaScript オブジェクトの違いを見分ける方法は?-jsチュートリアル-php.cn

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

Mary-Kate Olsen

リリース： 2024-10-26 19:52:29

オリジナル

1004 人が閲覧しました

How to Tell the Difference Between DOM Objects and JavaScript Objects?

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 サイトの他の関連記事を参照してください。