English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQueryのDOM遍歴

jQueryは、DOM木をナビゲートするためのノード関係を使用できます。

jQueryは、ドキュメント内の要素をランダムに選択するためのさまざまなDOM遍歴メソッドと順序メソッドを提供しています。

DOM遍歴とは何ですか?

DOM遍歴とは、ウェブページを構成するDOMの周りを移動することを意味します。DOMを遍歴するとき、ドキュメントツリーを必要な要素に上移動させることができます。また、指定された子ノードや同一階層のノードに下移動することもできます。これにより、データを収集したり変更する必要がある正確な位置を見つけることができます。

以下の図はHTMLページを木(DOM木)として表示しています。jQueryを使用して遍歴すると、選択された要素から簡単に木の中で上(祖先)、下(子孫)、横(同一階層)に移動できます。この移動をDOM木の遍歴といいます。-またはナビゲーション-または移動。

上の図から見て:

  • <html>は<head>と<body>の親要素であり、すべての要素の祖先

  • <head>は<title>の親要素であり、<html>の子要素です

  • <body>は<h1>と<a>の親要素であり、<html>の子要素です

  • <title>は<head>の子要素であり、<html>の後代です

  • <h1>は<body>の子要素であり、<html>の後代です

  • <a>は<body>の子要素であり、<html>の後代です

  • これらの<h1>と<a>の兄弟同級要素(共同的な親要素を持っているため),<html>と<body>の後代です。

祖先とは、父母、祖父母、曾祖父母などです。

後代とは、子供、孫、曾孫などです。

兄弟要素とは、同じ親要素を共有する要素です。

DOMツリーの遍歴

jQueryは、DOMを遍歴するためにさまざまなメソッドを提供しています。

次の章では、DOMツリー内で上/下に移動する方法について説明します。

jQueryの遍歴リファレンス

完全な遍歴メソッドの詳細については、当社のjQueryの遍歴リファレンス