dom

dom节点
-文档节点：整个Html文档
-元素节点：Html文档中的HTML标签
-属性节点：元素的属性
-文本节点：Html标签中的文本内容

dom树

dom事件对象

dom Document对象

• 通过document对象调用获取元素节点

    window.onload()
      //会在整个页面加载完成之后才触发 为window绑定一个onload事件
      window.onload = function() {
        alert("hello");
      }
  
    document.getElementById()
    document.getElementsByTagName()
    document.getElementByName() //-通过name属性
  

dom元素对象

• 通过具体元素节点获取内容

    node.innerHTML
    node.innerText //获取元素内部的文本内容，和innerHTML不同的是它会自动将html去除
  
    node.nodeValue //文本节点
  

• 通过具体元素节点调用获取元素节点的子节点

    node.getElementsByTagName()
    node.childNodes //-属性，表示当前节点的所有子节点 包括文本节点（注：空白文本节点）
    node.children //-属性，可以获取当前节点的所有子元素
    node.firstElementChild //-属性，可以获取当前节点的第一个子元素
    node.lastElementChild //-属性，可以获取当前节点的最后一个子元素
    node.firstChild //-属性，表示当前节点的第一个子节点
    node.lastChild //-属性，表示当前节点的第一个子节点
  

• 通过具体元素节点调用获取元素节点的父节点和兄弟节点

    node.parentNode //-属性，表示当前节点的父节点
    node.previousSibling //-属性，表示当前节点的前一个兄弟节点 (可能获取到空白文本节点)
    node.nextSibling //-属性，表示当前节点的后一个兄弟节点 (可能获取到空白文本节点)
    node.previousElementSibling //-属性，表示当前节点的前一个兄弟元素
    node.nextElementSibling //-属性，表示当前节点的后一个兄弟元素