DOM简介

DOM(document Object model)文档对象模型。
其实就是将一些标记型的文档以及文档中的内容当成对象。
为什么要将这些文档以及其中的标签封装成对象呢?
因为可以在对象中定义其属性和行为,可以方便操作这些对象。

DOM在封装标记型文档时,有三层模型。
DOM1:针对html文档。
DOM2:针对xml文档
DOM3:针对xml文档




html,xhtml,xml:这些都是标记型文档。

DHTML:是多个技术的综合体。叫做动态的html。
	html:负责将数据进行标签的封装。
	css:负责标签的样式。
	dom:负责将标签以及标签中的数据封装成对象。
	javascript:负责通过程序设计方式来操作这些对象。

标签之间存在着层次关系:
window
	|--
	|--
	|--


document
html
     |--head
	|--title
	|--base
	|--link
	|--meta
	|--style
	|--script
     |--body
	|--div
	|--form
		|--input
		|--select
	|--span
	|--a
	|--table
		|--tbody
		    |--tr
			|--td
			|--th
	|--dl
	   |--dt
	   |--dd

通过这个标签层次,可以形象的看作是一个树型结构。那么我也称标记型文档,加载进内存的是一颗DOM树。
这些标签以及标签的数据都是这棵树上的节点。

当标记型文档加载进内存,那么内存中有了一个对应的DOM树。

DOM对已标记型文档的解析有一个弊端就是文档过大,相对消耗资源。
对于大型文档可以使用SAX这种方式解析。

节点类型:
标签型节点:类型:1
属性节点:类型 : 2
文本型节点:类型:3
注释型节点:类型:8
document: 类型 9。



注意:标签之间存在空行时,会出现一个空白的文本节点,在获取节点时一定要注意。


节点的关系:
父节点,parentNode
子节点。childNodes:直接子节点。返回的是一个节点对象数组。
兄弟节点
	上一个兄弟节点。previousSibling
	下一个兄弟节点。nextSibling



---------------------

获取可以通过节点的层次关系完成。


也可以通过document对象完成。
getElementById :通过id属性值获取对应的节点对象。如果有多一个id值相同。获取到的是第一个id所属对象。
		尽量保证ID唯一性。返回的是一个对象。
getElementsByName :
		通过标签的name属性值获取对象。返回的一堆对象。其实是一个对象数组。


getElementsByTagName :即没有id也没有name时,可是通过标签名来获取节点对象。返回的是一堆对象。其实是一个对象数组。
			大多容器型标签都具备该方法。


 

你可能感兴趣的:(dom)