DOMツリーと構文木の違い

Question

レンダリングの理解をしている中で構文木からDOMツリーを作成していると書いてあったのですが
構文木とDOMツリーの違いがわかりません　　
一部では構文木とDOMツリーは同一と書いてある記事もありました.
どのような違いがあるのでしょうか？

Comments

[hoshi-takanori]

構文木は純粋なデータ構造ですが、DOM は表示用のオブジェクトで、状態 (input なら入力内容など) を持ちます。

[Zuishin]

回答しています。わかったのかわからなかったのか、何とか言ってください。

Answer 1

• 構文木というのは、言語の構文を解析し、テキストで書かれたものを木構造にして扱いやすくしたものです。

• DOM ツリーは、HTML の構文を解析し、テキストで書かれたものを木構造にして扱いやすくしたものです。

この意味では同じです。DOM ツリーは構文木の一種であると言えます。

しかし、構文木の主目的が構文解析であるのに対し、DOM ツリーの主目的は HTML への API を提供することです。その面では構文木と言ってしまうには少し逸脱した機能を持っているとも言えます。

たとえば、DOM ツリーにはスタイルが含まれます。スタイルは HTML を解析して得られたものではなく、CSS から得られたものである可能性があるので、DOM ツリーは HTML の構文を木構造にしたものとは言い難くなります。

構文木と DOM ツリーは別のレイヤーに属する言葉なので、重なる部分もあり、重ならない部分もあります。文脈次第と言えるでしょう。

Comments

[Zuishin]

もう少し言うなら、DOM ツリーは HTML だけに使われる用語で、構文木はあらゆる言語に対して使われる一般的な用語です。両者の違いを知りたければ、違いを比較していくよりも、二つは全く別の概念と思って片方ずつ調べた方が早道だと思います。

たとえば「手と脚はどう違いますか？」と聞かれたらどう答えますか？
手は脚から進化したもので、大きく言うと脚の一種とも言えますが、脚と言うには特殊なものとも言えます。