モダンjavascript入門14


📌 ドキュメント管理


WebコンテンツはDocumentオブジェクトによって管理されます.
  • WebブラウザがWebページを読み込むと、レンダリングエンジンはHTMLドキュメント解析
  • を表示します.
  • Documentオブジェクト形成DOMツリーというツリー構造
  • これはDOMツリーを構成するオブジェクトの1つをノードと呼びます.
  • ドキュメントノード:ドキュメント全体のDocumentオブジェクトを指します.文書
  • を参照してください.
  • HTML要素ノード:HTML要素を指すオブジェクト
  • テキストノード:テキストを指すオブジェクト


  • 空白ノード
    エレメントの後ろに複数のスペース文字がある場合でも、HTMLは無視されます.
    要素の前後に連続する空白文字が見つかった場合、DOMツリーはテキストとみなされ、テキストノードとして作成されます.

    👉 ノードオブジェクトのプロパティ



    このようなparentNode~previousSibling property DOMツリーに階層があればよい
    これを背負おうとしないで、上に見たようにNodeListツリーがあります.
    階層を正しく定義する意味を知りたければ、探してみてください.

    HTML要素のツリー


    HTML要素のツリーもそうです.

    HTMLドキュメントのbody要素オブジェクトを参照できます.
    document.children[0].children[1]
    document.firstElementChild.lastElementChild
    これで<body> ...<body>結果が出ます.

    プライマリノードオブジェクト



    👉 ノードオブジェクトのインポート



    また、classまたは태그이름をインポートすることもできます.
    こうやって持ってきたら.NodeListオブジェクトが返されます.NodeListオブジェクトは、類似した配列のオブジェクトであり、読み取り専用である.
    残り.似たような形で入っていて、好奇心のあることは本を読むことができます.
    重要なのは、ロードがNodeListオブジェクトを返すことです.NodeListオブジェクトは、類似した配列のオブジェクトであり、読み取り専用である.