DOM笔记.doc

/*****第一天*****/ 总结: 1. 调试: 打桩: 在程序的关键位置，输出关键变量的值 顺序: 方法调用的顺序 2. 串联知识点: 1. 用思维导图整理所有知识点的树形结构 2. 关于案例: 重要案例写三遍: 1. 连注释和代码完整抄一遍 2. 保留注释，去掉代码，尝试写回代码 3. 全部去掉，自己尝试将注释和代码一起写回 3. 如何串联: 用项目 1. 多读别人写的项目,标记注释和实现过程 2. 尝试优化别人的项目 1. 什么是DOM: JavaScript=ECMAScript(核心语法标准)+ DOM(专门操作网页内容的API标准)3天+ BOM(专门操作浏览器窗口的API)2天 什么是DOM: 专门操作网页内容的API标准 W3C 所有浏览器100%兼容DOM标准 实现功能: 查找，修改，添加，删除 DOM: 分2大部分: 1. 核心DOM: 可操作一切结构化文档的API 结构化文档: XML HTML XML: 可自定义标签名称的标记语言 比如: Student sname范冰冰/sname math89/math /Student JSON: {sname:范冰冰,math:89} HTML: 固定标签名称的超文本标记语言 优: 万能 缺: API繁琐 2. HTML DOM: 对核心DOM中*部分*API的简化 专门用于操作HTML网页的内容 优: 简单 缺: 无法完成所有操作 实际开发中: 优先使用HTML DOM简化实现功能 如果HTML DOM实现不了的，可用核心DOM补充 鄙视题: 解释关键词: HTML XHTML DHTML XML HTML: 专门编写网页内容的超文本标记语言 XHTML: 严格的HTML语言标准 DHTML: 所有能实现网页动态效果的技术的统称 DHTML=HTML+CSS+JS XML: 可扩展(自定义标签)的标记语言 2. ***DOM树 什么是DOM树: 网页中的所有内容，在内存中，都是以树形结构存储 document对象是整棵树的树根 其余网页内容中的元素，属性和文本都是document的子节点 如何创建: 当浏览器窗口获得一段HTML内容时: 首先在全局创建document对象，作为树的根节点 顺序读取HTML内容中每个元素，文本和属性。。。 将每个内容都创建为对应类型的节点对象，挂到父节点下 节点对象(Node): 网页中的所有内容都是一个节点对象: 包括: 标签，属性，文本，注释。。。 节点对象的父类型都是Node: 每个节点都有三大属性: nodeType: 节点类型: 一个数字 ELEMENT_NODE: 1 ATTRIBUTE_NODE: 2 TEXT_NODE: 3 DOCUMENT_NODE: 9 何时使用: 仅判断节点类型时 nodeName: 节点名: 元素节点: 标签名 ——全大写 属性节点: 属性名 文本节点: #text document节点: #document 何时使用: 需要判断元素节点的标签名时 nodeValue: 节点值: ——仅对文本节点和属性节点有效 元素节点: null 属性节点: 属性值