DOM（一）
Ajax---DOM（一）
DOM=Document Object Model 文档对象模型，Any More else?。DOM到底是什么东西？翻译一下Jesse James Garrett提到的那篇文章，文章有些长，不过确实精确地说明了DOM到底是什么东东，虽然这篇文章是针对NetScape写的，不过DOM由W3C统一管理，各个浏览器的实现应该是一样的。
为6.0浏览器编写脚本
Scott Andrew LePera
2002/01/27
诚然，NetScape 6还远没有达到完美，但是对DOM和CSS的强有力的支持，已经使它在正确的方向上前进了很大的一步。它有希望成为流行前线的No.1，成功的浏览器将被大众冲浪者接受，并使开发者的生活更加容易。
那么这对编写脚本的人们意味着什么？太多了，因为DOM结构暴露了新的强有力的方法，可以用它们访问和操纵任何的文档的元素。这胜过了DHTML和它的<div>标签。它可以通过JavaScript对页面的任意一个元素做全面的控制。
利用DOM的脚本方法可以实现如下功能：
1.凭空产生新的元素（on the fly)。不需要用document.write()在页面里插入Html和CSS，不需要对象构造，DOM允许你凭空产生全部元素（out of thin air)。
2.获取文档的所有标签，或者在不获取标签的情况下获取文本内容。
3.不需要改写innerHtml或者document.write()，就可以插入，改变或者删除任何元素的文本。
4.移动文档的部分内容或者作为碎片移除部分内容，并对它们进行处理。
4.最好的是，所有的这些新方法都可以在支持DOM的所有浏览器上运行，再也不用探测到底是哪种浏览器了。不再需要为同一个页面针对不同的页面写不同的版本了。它只需要一个脚本。
这篇文章非常简洁，没有对DOM脚本做技术上的介绍，并且注意力放到NetScape 6。更多的介绍请参照W3C关于DOM和CSS 的介绍。
是不是已经很兴奋了？让我们来看一下DOM的实质吧！
Part1.整体的了解（New Pieces Of The Puzzle）
DOM最好的理解是把它当成一棵树，主干表示文档，很多分支表示页面上的不同元素。树的每一个部分都称为node,Nodes可以是标签，比如HTML和XML，也可以是标签的属性，比如"align=left"或者"size=3"。Nodes也可以是文档内的文字信息，正如你现在看到的页面内容。
一个结点可以是另一个更大结点的一部分，更大的结点称为该结点的父结点。一个结点也可以是在它之内任意的数量的子节点的父结点。比如，document就是一个结点，如果文档包含图片，那么document就是图片结点的父结点，它们依次称为document的子节点，图片结点又是他们属性子结点的父结点。正如树是树枝的父结点，树枝是叶子的父结点一样，所以称为文档对象模型。
阿哦，明白了？
在4.0版本的浏览器里，我们能够用JavaScript操作的结点个数受到限制。利用全面支持DOM的程序比如NetScape6.0和Mozilla，几乎所有的元素和结点都可以为我们所用。如何访问它们首先取决于元素属性的ID，让我们看一下两个重要的DOM方法，它们允许我们访问结点。
getElementById()
如果你知道一个元素的ID，可以直接采用新的DOM文档方法getElementById()访问它。只需要把元素的ID作为方法的参数，该方法将返回对元素的引用。
<div id="myElement"></div>
为了在JavaScript中获取上述元素，我们可以利用
x = document.getElementById("myElement")
x现在已经变成这个<div>元素的引用，我们就可以用x操作这个<div>标签，正如我们马上就会看到的那样。
getElementsByTagName()
另一个获取元素的方式是通过getElementsByTagName()这个方法，这个方法用标签类型作为参数，返回文档内所有为该类型的元素的集合（或者数组）。
比如，你要获取文档内所有的图片元素的集合，你应该这样作：
x = document.getElementsByTagName("img")
x成为文档内所有<IMG>元素引用的集合。要访问集合中的特定元素，比如第一个元素，我们可以通过它的初始号或者在集合中的位置引用。
x = document.getElementsByTagName("img")
firstImage = x.item(0)
getElementsByTagName()获取所有匹配的元素，而不管有没有ID分配给它们，这使得获取没有通常不会分配ID的元素非常方便，比如<P>,<TD>
getElementById()和getElementsByTagName()是遍历DOM树的很好的方式，因为我们不需要写脚本查找直到最远的分支。不是采用document.something.somethingElse的方式获取元素，你可以利用这两个方法直接获取它，或者象它的元素。
为6.0浏览器编写脚本
Scott Andrew LePera
2002/01/27
诚然，NetScape 6还远没有达到完美，但是对DOM和CSS的强有力的支持，已经使它在正确的方向上前进了很大的一步。它有希望成为流行前线的No.1，成功的浏览器将被大众冲浪者接受，并使开发者的生活更加容易。
那么这对编写脚本的人们意味着什么？太多了，因为DOM结构暴露了新的强有力的方法，可以用它们访问和操纵任何的文档的元素。这胜过了DHTML和它的<div>标签。它可以通过JavaScript对页面的任意一个元素做全面的控制。
利用DOM的脚本方法可以实现如下功能：
1.凭空产生新的元素（on the fly)。不需要用document.write()在页面里插入Html和CSS，不需要对象构造，DOM允许你凭空产生全部元素（out of thin air)。
2.获取文档的所有标签，或者在不获取标签的情况下获取文本内容。
3.不需要改写innerHtml或者document.write()，就可以插入，改变或者删除任何元素的文本。
4.移动文档的部分内容或者作为碎片移除部分内容，并对它们进行处理。
4.最好的是，所有的这些新方法都可以在支持DOM的所有浏览器上运行，再也不用探测到底是哪种浏览器了。不再需要为同一个页面针对不同的页面写不同的版本了。它只需要一个脚本。
这篇文章非常简洁，没有对DOM脚本做技术上的介绍，并且注意力放到NetScape 6。更多的介绍请参照W3C关于DOM和CSS 的介绍。
是不是已经很兴奋了？让我们来看一下DOM的实质吧！
Part1.整体的了解（New Pieces Of The Puzzle）
DOM最好的理解是把它当成一棵树，主干表示文档，很多分支表示页面上的不同元素。树的每一个部分都称为node,Nodes可以是标签，比如HTML和XML，也可以是标签的属性，比如"align=left"或者"size=3"。Nodes也可以是文档内的文字信息，正如你现在看到的页面内容。
一个结点可以是另一个更大结点的一部分，更大的结点称为该结点的父结点。一个结点也可以是在它之内任意的数量的子节点的父结点。比如，document就是一个结点，如果文档包含图片，那么document就是图片结点的父结点，它们依次称为document的子节点，图片结点又是他们属性子结点的父结点。正如树是树枝的父结点，树枝是叶子的父结点一样，所以称为文档对象模型。
阿哦，明白了？
在4.0版本的浏览器里，我们能够用JavaScript操作的结点个数受到限制。利用全面支持DOM的程序比如NetScape6.0和Mozilla，几乎所有的元素和结点都可以为我们所用。如何访问它们首先取决于元素属性的ID，让我们看一下两个重要的DOM方法，它们允许我们访问结点。
getElementById()
如果你知道一个元素的ID，可以直接采用新的DOM文档方法getElementById()访问它。只需要把元素的ID作为方法的参数，该方法将返回对元素的引用。
<div id="myElement"></div>
为了在JavaScript中获取上述元素，我们可以利用
x = document.getElementById("myElement")
x现在已经变成这个<div>元素的引用，我们就可以用x操作这个<div>标签，正如我们马上就会看到的那样。
getElementsByTagName()
另一个获取元素的方式是通过getElementsByTagName()这个方法，这个方法用标签类型作为参数，返回文档内所有为该类型的元素的集合（或者数组）。
比如，你要获取文档内所有的图片元素的集合，你应该这样作：
x = document.getElementsByTagName("img")
x成为文档内所有<IMG>元素引用的集合。要访问集合中的特定元素，比如第一个元素，我们可以通过它的初始号或者在集合中的位置引用。
x = document.getElementsByTagName("img")
firstImage = x.item(0)
getElementsByTagName()获取所有匹配的元素，而不管有没有ID分配给它们，这使得获取没有通常不会分配ID的元素非常方便，比如<P>,<TD>
getElementById()和getElementsByTagName()是遍历DOM树的很好的方式，因为我们不需要写脚本查找直到最远的分支。不是采用document.something.somethingElse的方式获取元素，你可以利用这两个方法直接获取它，或者象它的元素。
浙公网安备 33010602011771号