Ellisソフトウェアエンジニアリング🐰 - DOMとノードオブジェクト

5047 ワード
Node テキストリンク
写真と情報源:Ellisswエンジニアリング

🤔 ノードオブジェクト?


🌲 ノードツリー


:HTML DOMに情報を格納する階層単位

  • ノードツリーはノードの集合であり,ノード間の関係を表す.


  • JavaScriptではdomを使用してノードツリーに含まれるすべてのノードにアクセスできます
    • <html>
  <head>
    <title>자바스크립트 기초</title>
  </head>
  <body>
    <article>
      <header>header</header>
      <section>
        <header>header 1</header>
       section1
      </section>
    </article>
  </body>
</html>

    🪜 ノードタイプ

  • ドキュメントノード:HTMLドキュメント全体を表すノード
  • 要素ノード:すべてのHTML要素は要素ノードであり、属性ノードを持つ一意のノード
  • アノテーションノード:HTMLドキュメント内のすべてのアノテーションはアノテーションノード
    • にあります.
  • 属性ノード:すべてのHTML要素の属性には属性ノード、要素ノードに関する情報が含まれているが、その要素ノードのサブノードには含まれていない
    • .
         head노드가 가진 속성
    /   \
title   h1 여기에는 포함 ㄴㄴ
  • テキストノード:HTMLドキュメント内のすべてのテキストがテキストノード
    • である.
    <p>텍스트 노드</p>

    ❕節点値


    :ノードに関する情報にアクセスできるプログラムは次のとおりです.
    nodeName, nodeValue, nodeType
    document.childNodes[0].nodeName;
:html 문서의 모든 자식 노드 중 첫 번째 노드의 이름

document.getElementById("id").firstChild.nodeValue;
:아이디가 id인 요소의 첫 번째 자식 노드의 노드 값

document.getElementById("id").firstChild.nodyType;
:아이디가 id인 요소의 첫 번째 자식 노드의 노드 타입
    SVG animate呼吸シンチレーション効果を実現
    基礎文法の整理