DOM简介

1. 什么是DOM: Document Object Model
       专门操作网页内容的API
       W3C DOM标准 浏览器厂商实现DOM标准
   DHTML: 一切实现网页动态效果的技术的统称
     HTML+CSS+JavaScript
   鄙视题： HTML XHTML DHTML XML
     HTML: 专门编写网页内容的语言
     XHTML: 严格的HTML标准
     DHTML: 所有实现网页动态效果的技术的统称
     XML: 可扩展的标记语言——可自定义标签名的标记语言
     <student>
<name>范冰冰</name>
<math>89</math>
<chs>65</chs>
<eng>95</eng>
     </student>
     被json代替: JavaScript Object Notation
"{'name':"范冰冰",'math':89,'chs':65,'eng':95}"


  DHTML模型: 
    BOM: Browser Object Model
专门操作浏览器窗口的API
没有标准，所以，用的很少
    DOM: Document Object Model
专门操作网页内容的API
W3C DOM标准 浏览器厂商几乎100%实现DOM标准


  DOM: 本来是可以操作一切结构化文档: HTML和XML
     核心DOM: 可操作一切结构化文档的API
万能！ 但API繁琐！
增 删 改 查
     HTML DOM: 专门操作网页内容的API
   其实是基于核心DOM的简化版本。
        API简洁！ 仅对复杂HTML元素提供了简化——不是万能
        改  复杂元素:增加和删除
     实际开发: 优先使用HTML DOM，
      HTML DOM实现不了的，用核心DOM补充


2. ***DOM Tree: 保存所有网页内容的树形结构
    网页中每个内容(元素，文本，属性...)都是树上的节点
   网页加载过程: 
   html代码-DOM Tree
                  |
                  Rander Tree-计算布局和位置-paint
                  |              (layout)
   css代码-cssRules
   DOM Tree的加载过程: 
     1. 在开始加载网页内容前，先创建document节点
document节点是整棵DOM树的树根
查找,创建
     2. 顺序读取网页内容，在document节点下，追加子节点
   
   每个节点都是一个对象: Node
     三大属性: 
       nodeType: 描述节点的类型，一个数值
DOCUMENT_NODE: 9
                 ELEMENT_NODE: 1
                 ATTRIBUTE_NODE: 2
                 TEXT_NODE: 3
         何时使用: 判断节点类型
       nodeName: 描述节点的名称
document节点: #document
        *元素节点: 标签名 ——全大写！
         属性节点: 属性名
        *文本节点: #text
何时使用: 判断节点的名称时
       nodeValue：描述节点的内容
document节点: null
         元素节点: null
        *文本节点: 文本内容

        *属性节点: 属性值

 节点间关系: 
     1. 父子: 
parentNode childNodes firstChild lastChild
     2. 兄弟: previousSibling nextSibling
    强调: 除parentNode外，其余都会受到空字符的干扰

****遍历节点树: 对每个子节点执行相同的操作
    递归: 函数内，又调用了自己
      何时使用: 遍历不确定层级深度的树形结构时 
    如何实现递归:
      1. 先实现遍历直接子节点的方法：
       强调: childNodes是动态集合
动态集合: 不保存完整的节点属性，只保存节点的位置
       只要访问动态集合，都会导致重新查找DOM树
          优: 快速返回查找结果
          缺: 每次访问动态集合，都重新查找——效率低
        遍历时: 都要先将length属性存在变量中
      2. 对每个子节点，再执行和父节点相同的操作！


    算法: 深度优先！优先遍历当前节点的子节点
 子节点遍历完，才跳到兄弟节点


    递归 vs 循环
    1. 递归: 优：直观，易用
             缺：占用更多资源，效率低
    2. 循环: 优: 几乎不占资源，效率高！
             缺: 难度高，代码量大


    递归中获得当前函数本身: arguments.callee