标签：
小编步入BS的学习阶段有段时间了，学习拖拖拉拉，需要好好整理之前学习到的知识。回顾JavaScript 中的知识点之DOM（Document ObjectModel）文档对象模型，针对HTML和XML文档的API (应用程序接口)。
是W3C组织推荐的处理可扩展标志语言的标准编程接口。
一.DOM 介绍
DOM 中的三个字母：D（文档）理解为D（文档）可以理解为整个Web 加载的网页文档；O（对象）可以理解为类似 window 对象之类的东西，可以调用属性和方法，这里我们说的是document对象；M（模型）可以理解为网页文档的树型结构。
DOM的分级：根据W3CDOM规范，DOM是HTML与XML的应用编程接口（API），DOM将整个页面映射为一个由层次节点组成的文件。有1级、2级、3级共3个级别。
PS:IE 中的所有 DOM对象都是以 COM 对象的形式实现的，这意味着 IE 中的 DOM可能会和其他浏览器有一定的差异。
节点
根据DOM，HTML 文档中的每个成分都是一个节点。
DOM是这样规定的：
整个文档是一个文档节点
每个HTML 标签是一个元素节点
包含在HTML 元素中的文本是文本节点
每一个HTML 属性是一个属性节点
注释属于注释节点
PS:从上图的树型结构，我们理解几个概念，html标签没有父辈，没有兄弟，所以 html 标签为根标签。head 标签是 html 子标签，meta 和 title标签之间是兄弟关系。如果把每个标签当作一个节点的话，那么这些节点组合成了一棵节点树。
节点树
节点分为三类：
二.查找元素
W3C提供了比较方便简单的定位节点的方法和属性，以便我们快速的对节点进行操作。分别为：getElementById()、getElementsByTagName()、getElementsByName()、getAttribute()、setAttribute()和removeAttribute()。
一个页面只能允许一个ID 表示唯一性
getElementById 建议区分大小写，以免不兼容
如果是IE5.0 不兼容getElementById，可以做个判断
三.DOM节点
node 节点属性
节点可以分为元素节点、属性节点和文本节点，而这些节点又有三个非常有用的属性，分别为：nodeName、nodeType和 nodeValue。
这些节点的存在不单单是可以方便查找，同时也可以创建节点、复制节点、插入节点、删除节点和替换节点。
dome
DOM 在操作生成HTML 上是比较简明的 我们可以用<table >标签可以用DOM来创建
在一个表内只能有一个表尾
/**/
window.onload =function(){
//alert(Node);
alert(typeof Node);
}
window.onload =function(){
//alert(document);
alert(document.childNodes[0].nodeName);
//alert(typeof Node);
}
window.onload=function(){
var box=document.getElementById('box');
box.outerHTML='<b>123</b>';
alert(document.getElementById('box'));
}
//使用DOM 来创建一个标签
window.onload=function (){
var table =document.createElement('table');
table.width=300; //table.setAtrribute('width',300);
table.border=1;
var caption=document.createElement('caption');
table.appendChild(caption);
//caption.innerHTML='人员表';
var captionTitle =document.createTextNode('人员表');
caption.appendChild(captionTitle);
var thead=document.createElement('thead');
table.appendChild(thead);
var tr=document.createElement('tr');
thead.appendChild(tr);
var th=document.createElement('th');
tr.appendChild(th);
th.appendChild(document.createTextNode('数据一'));
var th2=document.createElement('th');
tr.appendChild(th2);
th2.appendChild(document.createTextNode('数据二'));
document.body.appendChild(table);
}
//使用DOM去获取表格显示效果：
表一是在<body></body>节点下添加<table>标签实现的。
小编感言：
有些知识需要注意：
1.window对象作为全局对象，也就是说你可以通过window来访问全局对象。
属性在对象下面以变量的形式存放，在页面上创建的所有全局对象都会变成window对象的属性。
方法在对象下面以函数的形式存放，因为左右的函数都存放在window对象下面，所以他们也可以称为方法。
2.DOM为web文档创建带有层级的结果，这些层级是通过node节点组成，这里有几种DOM node类型，最重要的是Element, Text,Document。
Element节点在页面里展示的是一个元素，所以如果你有段落元素(<p>)，你可以通过这个DOM节点来访问。
Text节点在页面里展示的所有文本相关的元素，所以如果你的段落有文本在里面的话，你可以直接通过DOM的Text节点来访问这个文本
Document节点代表是整个文档，它是DOM的根节点。
3.每个引擎对DOM标准的实现有一些轻微的不同。例如，Firefox浏览器使用的Gecko引擎有着很好的实现（尽管没有完全遵守W3C规范），但IE浏览器使用的Trident引擎的实现却不完整而且还有bug，给开发人言带来了很多问题。
标签：
原文地址：http://blog.csdn.net/u010293698/article/details/43313527
