1. ホーム
  2. ジャバスクリプト

[解決済み】Javascriptで、ある要素が別の要素に含まれているかどうかを確認する方法

2022-04-07 18:05:51

質問

ある DOM 要素が他の DOM 要素の子であるかどうかを確認するにはどうしたらよいですか?このための組み込みのメソッドはありますか?例えば、次のようなものです。

if (element1.hasDescendant(element2)) 

または

if (element2.hasParent(element1)) 

もしそうでなければ、どうしたらいいでしょうか?また、クロスブラウザである必要があります。また、子は親の何レベルも下にネストされる可能性があることを述べておかなければなりません。

どのように解決するのですか?

更新してください。 これを実現するためのネイティブな方法が登場しました。 Node.contains() . コメントと以下の回答にも記載されています。

古い回答です。

を使用することで parentNode プロパティは動作するはずです。また、クロスブラウザの観点からもかなり安全です。もし、関係が一段深いことが分かっているのであれば、簡単にチェックすることができます。

if (element2.parentNode == element1) { ... }

もし、子が親の中に任意に深くネストできるのであれば、次のような関数を使って関係をテストすることができます。

function isDescendant(parent, child) {
     var node = child.parentNode;
     while (node != null) {
         if (node == parent) {
             return true;
         }
         node = node.parentNode;
     }
     return false;
}