dom基础和基本api（DOM basic and basic API）.docVIP

dom基础和基本api（DOM basic and basic API） regedit启动注册表 dom基础和基本api dhtml. 一、什么是dom? 什么叫dom, dom是文档对象模型 (document object model, 是基于浏览器编程 (在本教程中, 可以说就是dhtml编程) 的一套api接口, w3c出台的推荐标准, 每个浏览器都有一些细微的差别, 其中以mozilla的浏览器最与标准接近.单纯的javascript要结合dom才能做dhtml编程, 才能做出漂亮的效果、应用于web.这点几乎与其它的语言无异, 正如c / (c + + 需要库支持是一样的道理.否则就是单纯的在语法上做研究了.因此, 必须要对dom有一定的认识, 才能把javascript应用于web, 或你的ria应用当中, 因为dhtml本质上就是操作dom树. 以后的编程当中, 希望你能够把dhtml.chm这本手册也拿上, 如果你需要兼容gecko, 把gecko的dom手册也带上.因为api太多, 想不起来的接口还可以查这本手册. 如果你要测试浏览器是否是支持dom的, 简单的一句就可以判断 script issupportdom var =. . document.getelementbyid; / / 两个取反, 这已经在上节中说过了, 意思是强制转型 alert (你的浏览器 + (issupportdom? : 不) + 支持 dom!); script / 二、dom树 要注意: dom树的根统一为文档根 document, dom既然是树状结构, 那么他们自然有如下的几种关系: 根结点 (document) 父结点 (parentnode) 子结点 (childnodes) 兄弟结点 兄弟结点 (sibling) (sibling) 例子: 假设网页的html如下 程序代码 html head title never - online website title / s / i body tutorial div of / div and programming dhtml. / body html / 我们参照树的概念, 画出该html文档结构的dom树: html body head. div title). 文本 文本 从上面的图示可以看出 html有两个子结点, 而html就是这两个子节点的父结点 head有节点title, title下有一个文本节点 doby下有节点div, div下有一个文本节点 三、操作dom树 开篇已经说过, dhtml本质就是操作dom树.如何操作它呢? 假设我要改变上面html文档中div结点的文本, 如何做? 程序代码 html head title never - online website title / s script function changedivtext (strtext) { noderoot var = document; / / 这个是根结点 nodehtml noderoot.childnodes var = [0]; / / 这个是html结点 nodebody var = nodehtml.childnodes [1]; / / body结点 was nodediv = nodebody.childnodes [0]; / / div结点 was nodetext = nodediv.childnodes [0]; / / 文本结点 nodetext.data = strtext; / / 文本节点有data这个属性, 因此我们可以改变这个属性, 也就成功的操作了dom树中的一个结点了 } script / head / body div tutorial of dhtml and javascript programming / div input onclick = changedivtext (change? type = button value = change / / body html 从上面的示例可以看出, 我们可以用上面的这种方法操作dom树上的任一节点. (注: 1. 跨域除外, 跨域通常是在操作frame上, 简单的说, 就是两个frame不属于同一域名.2.上面的操作为了演示, 采用的方法是从根结点一直到文本结点的遍历, 在dom方法上, 有更简洁的方法, 这些以后会有更多示例加以说明, 下文中也会有介绍) 三、dom节点. 细心些的朋友也许发现了, 在上面写的html代码时用 与 / 包函起来的就是一个