传智播客Java培训---DOM编程

以前用HTML做的网页都是静态的，学习了DOM后我们就可以使网页具备动态效果。DOM是document object model(文档对象模型)的简写，它将将标记型文档(html,xml)封装成了对象,为了操作页面上的标签，将标签对象化，这样就可以在对象中的定义属性和行为对标签对象进行操作，从而实现网页的动态效果。

 

DOM有三层模型：

DOM1:HTML文档的模型。

DOM2:xml文档的模型。

DOM3:xml文档的模型。

我们在基础班主要讲解的是DOM1:HTM文档的模型，DOM2/DOM3在就业班将xml

会讲到。

DOM常用对象有window,document,event等。

 

DOM把层次中的每一个对象都称之为节点（NODE），获取节点对象一般有三种方法：

document.getElementsByName(“xx”);xx表示标签内Name属性的值

document.getElementsByTagName(“xx”); xx表示标签名

document.getElementsById(“xx”); xx表示标签内的ID属性的值

下图是浏览器对象的分层结构：

操作节点的相关方法和属性：

event.srcElement     返回激活事件的源节点

creatElement        创建节点

node.parentElement  
node.parentNode       返回父节点 

node.childNodes    返回子节点集合

node.children        返回子标签节点集合

node.textNodes       返回子文本节点集合

node.firstChild          返回第一个子节点

node.lastChild        返回最后一个子节点

node.nextSibling         返回同属下一个节点

node.previousSibling     返回同属上一个节点

node.appendChild(oNode) 追加子节点

删除节点
node.remove()
node.removeChild()
node.removeNode(
替换节点
node.replaceChild()
node.replaceNode()
node.swapNode()

 

setTimeout()和setInterval()的区别：

setTimeout(表达式,延时时间)在执行时,是在载入后延迟指定时间后,去执行一次表达式,次数是一次。

setInterval(表达式,交互时间)则不一样,它从载入后,每隔指定的时间就执行一次表达式。

 

DHTML：动态的html，它是多项技术的综合体的总称。

       包含：html,css,javasrcipt,DOM.

    html：提供标签对数据进行封装。属于操作基础。

    css:负责页面的样式部分，提供更丰富的演示效果。

    DOM：将页面以及也年的标签都变成对象，并在对象中定义了属性和行为，可以指挥对象做事情。

    javascript: 通过程序设计语言对三者进行融合并复杂操作。

  

动态效果与动态页面。

动态效果出现在客户端，增强了用户浏览体验效果。

动态网页：可以和服务端进行交互的页面。