-
■ 元素节点， > 拥有子节点和文本，是唯一能拥有属性的节点类型<br> ■ 属性节点， > 元素中的属性，是附属于元素的，是包含他的元素节点的一部分，不属于文档树的一部分<br> ■ 文本节点， > 只包含文本内容(可以只包含空白)的节点，在xml中称为字符数据；<br> > 在文档树中元素的文本内容和属性的文本内容都是由文本节点表示的<br> > 某个节点的空白区域，也是属于文本节点<br> ■ 注释节点： > 表示注释的内容<br> ■ 文档节点： > 文档树的根节点，是其他节点的父节点； > 注意不是html或者xml的根元素。根元素是作为文档节点的子节点出现的<br> > 整个代码之上看做是文档节点<br> ■ 文档类型节点： 例;<!doctype html><br> ■ 文档片段节点： > 文档片段是轻量级的或者是最小的Document 对象，他表示文档的一部分或者是一段，他不属于文档树； > 他的特殊行为：占位符，暂时存放一次插入文档的节点，同时有利于剪贴复制操作查看全部
-
DOM1级主要定义了HTML和XML文档的底层结构。在DOM1中，DOM由两个模块组成：DOM Core（DOM核心）和DOM HTML。其中，DOM Core规定了基于XML的文档结构标准，通过这个标准简化了对文档中任意部分的访问和操作。DOM HTML则在DOM核心的基础上加以扩展，添加了针对HTML的对象和方法，如：JavaScript中的Document对象. DOM2级在原来DOM的基础上又扩充了鼠标、用户界面事件、范围、遍历等细分模块，而且通过对象接口增加了对CSS的支持。DOM1级中的DOM核心模块也经过扩展开始支持XML命名空间。在DOM2中引入了下列模块，在模块包含了众多新类型和新接口： DOM视图（DOM Views）：定义了跟踪不同文档视图的接口 DOM事件（DOM Events）：定义了事件和事件处理的接口 DOM样式（DOM Style）：定义了基于CSS为元素应用样式的接口 DOM遍历和范围（DOM Traversal and Range）：定义了遍历和操作文档树的接口 DOM3进一步扩展了DOM，在DOM3中引入了以下模块： DOM加载和保存模块（DOM Load and Save）：引入了以统一方式加载和保存文档的方法 DOM验证模块（DOM Validation）：定义了验证文档的方法 DOM核心的扩展（DOM Style）：支持XML 1.0规范，涉及XML Infoset、XPath和XML Base查看全部
-
1.1课程介绍 1.DOM是Docunment、object、Model的缩写，直译过来就是文档对象模型。 2.DOM的地位和作用 1.HTML→CSS(定义样式) 2.HTML→JavaScript（赋予行为） 通过JavaScript实现页面的交互和动画效果等等。 3.那么JavaScript通过什么来实现的呢？ 1.通过ECMAScript标准，我们可以编写程序让浏览器来解析 2.利用ECMAScript我们可以通过BOD对象来操作浏览器窗口、 浏览器导航对象、屏幕分辨率、浏览器历史、Cookies等等 3.但是通过BOD来实现的交互远远不够,要实现页面的动态交互 和效果，操作HTML才是核心。 4.那么如何操作HTML呢，那就是DOM。简单来说，DOM给我们提 供了用程序来动态控制HTML的接口，也就是早期的DHTML的 概念。 5.因此DOM处在JavaScript赋予HTML具备动态交互的核心地位 上。 注:BOM(Browser Object Model) 是指浏览器对象模型 cookies （从客户端的硬盘读取数据的一种技术） 3.DOM探索系列课程要点 1.想要安全的操作DOM必须等到页面上所有的HTML都解析成DOM节点， 才能进行操作，因此了解DOMReady是第一步。 2.接着我们来探究节点，学习文档和节点的类型，元素节点的判断、 元素节点的继承层次、以及节点的分类等内容。 3.然后学习节点的操作，比如节点创建与删除、节点查找与筛选等。 4.接着学习表格与表单的操作 5.最后我们探讨属性系统和样式设置 6.顺序图 1.DOMReady→2.节点探究→节点创建与删除→节点查找与筛选→ 表单与表格操作→属性系统→样式设置 4.基础详解篇课程要点 1.首先通过滑动门特效课堂案例感性认识DOM在开发中是如何运用的 2.其次，了解什么DOM以及与DOM相关的基础概念 3.重新认识HTML与XHTML文档类型，以及文档的各种节点类型 4.接着详细的实现DOMReady查看全部
-
domReady： html标签需要通过浏览器渲染引擎的解析才会变成dom节点，在刷新url地址的时候就有dom构建的过程。当所有html都转化为节点后，dom树才构建完毕，简称为dom ready。所以，一旦把script放在body前面，dom还没生成，就调用了dom(document.xxxx)明显是不行的（javascript以编写顺序解析---脚本语言）查看全部
-
function myReady(fn){ // 对于现代浏览器，对DOMContentLoaded事件的处理采用标准的事件绑定方式 if(document.addEventListener){ document.addEventListener("DOMContentLoaded", fn, false); // 在冒泡阶段捕获 } else { IEContentLoaded(fn); } // IE模拟DOMContentLoaded function IEContentLoaded(fn){ var d = window.document; var done = false; // 只执行一次的用户回调函数init() var init = function(){ if(!done){ done = true; fn(); } } (function(){ try{ // DOM树未创建之前调用doScroll会抛出错误 d.documentElement.doScroll('left'); } catch(e){ // 延迟再试一次，调用函数自身的事件 setTimeout(arguments.callee, 50); return; } // 没有错误就表示DOM树创建完毕，然后立马执行用户回调 init(); })(); // 监听document的加载状态 d.onreadystatechange = function(){ // 如果用户是在domReady之后绑定的函数，就立马执行 if(d.readyState == 'complete') { d.onreadtstatechange = null; init(); } } } }查看全部
-
DOM1级主要定义了HTML和XML文档的底层结构。在DOM1中，DOM由两个模块组成：DOM Core（DOM核心）和DOM HTML。其中，DOM Core规定了基于XML的文档结构标准，通过这个标准简化了对文档中任意部分的访问和操作。DOM HTML则在DOM核心的基础上加以扩展，添加了针对HTML的对象和方法，如：JavaScript中的Document对象. DOM2级在原来DOM的基础上又扩充了鼠标、用户界面事件、范围、遍历等细分模块，而且通过对象接口增加了对CSS的支持。DOM1级中的DOM核心模块也经过扩展开始支持XML命名空间。在DOM2中引入了下列模块，在模块包含了众多新类型和新接口： DOM视图（DOM Views）：定义了跟踪不同文档视图的接口 DOM事件（DOM Events）：定义了事件和事件处理的接口 DOM样式（DOM Style）：定义了基于CSS为元素应用样式的接口 DOM遍历和范围（DOM Traversal and Range）：定义了遍历和操作文档树的接口 DOM3进一步扩展了DOM，在DOM3中引入了以下模块： DOM加载和保存模块（DOM Load and Save）：引入了以统一方式加载和保存文档的方法 DOM验证模块（DOM Validation）：定义了验证文档的方法 DOM核心的扩展（DOM Style）：支持XML 1.0规范，涉及XML Infoset、XPath和XML Base查看全部
-
imgs[j].style.left = parseInt(imgs[j].style.left,10) - translate +'px'; 这个不是很理解；imgs[j].style.left = j*exposeWidth+'px';这些写就好理解了查看全部
-
判断XML和HTML的方法： 先使用isElememt判断是否为元素节点，再用creatElement判断元素名大写小写是否都等同，大小写不等同为XML，等同为HTML查看全部
-
domReady： html标签需要通过浏览器渲染引擎的解析才会变成dom节点，在刷新url地址的时候就有dom构建的过程。当所有html都转化为节点后，dom树才构建完毕，简称为dom ready。所以，一旦把script放在body前面，dom还没生成，就调用了dom(document.xxxx)明显是不行的（javascript以编写顺序解析---脚本语言）查看全部
-
获取某个元素的节点名称和节点值：nodeName和nodeValue属性值； 获取该节点的属性：ele.attributes; //返回类数组对象的该元素的所有属性 获取该节点的子节点：ele.childNodes;//返回所有子节点的类数组对象 document.createDocumentFragment();// 创建一个文档片段 document.doctype; // 获取文档类型查看全部
-
domReady： html标签需要通过浏览器渲染引擎的解析才会变成dom节点，在刷新url地址的时候就有dom构建的过程。当所有html都转化为节点后，dom树才构建完毕，简称为dom ready。查看全部
-
nodeType判断节点类型： 非ie中，可以使用字符串常量判断。divNode.nodeType == Node.ELEMENT_NODE。 ie中，由于没有Node对象，需使用数值判断。divNode.nodeType == 1(即元素节点的编号)。 故应该使用数值常量判断，可以兼容ie在内的所有浏览器！查看全部
-
!!的目的是，当操作数是undefined或null时能够返回false查看全部
-
DOM元素文本节点继承层次查看全部
-
浏览器渲染引擎的基本渲染流程： 1、解析HTML，构建DOM树（构建DOM节点）； 2、构建渲染树（解析样式信息，包括外部的css文件、style标签中的样式）。渲染树由一些包含有各种属性的矩形组成，他们将会按照正确的顺序显 示到屏幕上； 3、布局渲染树（布局DOM节点），执行布局的过程，将确定每个节点在屏幕上的确切坐标； 4、绘制渲染树（绘制DOM节点，即遍历渲染树），使用UI后端层来绘制每个节点。查看全部
举报
0/150
提交
取消