ホームページ  >  記事  >  ウェブフロントエンド  >  起源を解読する: DOM が DOM と呼ばれる理由

起源を解読する: DOM が DOM と呼ばれる理由

王林
王林オリジナル
2024-07-19 00:28:20649ブラウズ

Deciphering the Origins: Why the DOM is called the DOM?

ドキュメント オブジェクト モデル (DOM) は、基本的に「Web ページが舞台裏でどのように動作するか」を表す Web 開発用語であり、すべての Web 開発者が知っておくべきものです。彼らのツールキット。これは、現代の Web 開発を強化する秘密のソースのようなものです。

しかし、なぜ DOM なのでしょうか?最近、ブラウザがどのように動作するかを説明するビデオを見つけて、いくつかの記事について詳しく調べました。これが、「なぜ?」

についての私の理解です。

すべてのブラウザは ** ブラウザ エンジン ** で動作します。これは、HTML、CSS、JavaScript などの Web コンテンツを、ユーザーが操作できる視覚的な表現にレンダリングする役割を担う Web ブラウザのコア コンポーネントです。


「ドキュメント」: この用語は、Web ブラウザーにロードされる Web ページを指します。これは、見出し、段落、画像、リンク、フォームなどの要素を含む、Web ページのコンテンツの構造化された階層を表します。 DOM ドキュメントは基本的に、Web ページの構造をメモリ内で表現したもので、ページの読み込み時にブラウザのレンダリング エンジンによって作成されます。

次に、ブラウザ エンジンがドキュメントをノード ツリーに変換する方法の興味深い部分を説明します。ノード ツリーは、ペイント用の DOM として知られています。

ドキュメントをダウンロードした後、生のデータ、はい、0 と 1 に変換されます。そして、この生のデータのバイトは文字に変換されます。この変換は、HTML ファイルの文字エンコーディングに基づいて行われます。

これらの文字は、トークンと呼ばれるものにさらに解析されます。他のプログラミング言語のトークンと同様に、そのプログラミング言語の意味のある最小の個々の要素として定義できます。ここでのトークンとは、HTML 内のタグ、つまり body、h1、h2、 p、スパンなど

トークン化が完了したら、次のステップはこれらのトークンを構造化することです。 ここでオブジェクトが登場します。これらのトークンからオブジェクトが作成されます。これらのオブジェクトには、タグの開始、タグの終了、属性、データ/値など、各エンティティに関する多くの情報が含まれています。

これで、「ドキュメント」と「オブジェクト」 ができましたが、これらのオブジェクト間には関係がないため、まだ構造化されていません。トークン化後、これらのトークンはノードに変換されます。各ノードは、親ノード、子ノード、兄弟ノードを特徴とする別のノードとの関係を持ちます。これらのノード間の関係は、よく知られたツリー状の構造を形成します。このプロセスはオブジェクト ツリーのモデリングとして知られています。これで、HTML ドキュメントからノード ツリー モデルが準備され、ペイントする準備が整いました。

要約すると、「ドキュメント オブジェクト モデル」 という名前は、その目的と機能を反映しています。これは、オブジェクトのコレクションとして表される、Web ページ コンテンツの構造化モデルとして機能します。 「DOM」という名前は、「ドキュメント」(Web ページ)、「オブジェクト」(要素を表す)、「モデル」(構造化表現) の融合から生まれました。


これがお役に立てば幸いです。フィードバックをお寄せいただくか、具体的なご質問や懸念事項がございましたらお気軽にお問い合わせください。

以上が起源を解読する: DOM が DOM と呼ばれる理由の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。