HTML DOM简介

说起dom首先来看一个图例:

 HTML DOM简介_第1张图片

1、节点的概念:

在上面的dom结构图中可以看出图是由元素节点构成的,每一个html标签都是一个节点

 

2、节点分类:nodeType

     每个 HTML 标签是一个元素节点                  nodeTYpe  1

    每一个 HTML 属性是一个属性节点              nodeTYpe  2

     包含在 HTML 元素中的文本是文本节点     nodeTYpe  3

    注释属于注释节点                                  nodeTYpe  8

     整个文档是一个文档节点                nodeTYpe  9

 

3、节点树

      HTML 文档中的所有节点组成了一个文档树(或节点树)。HTML 文档中的每个元素、属性、文本等都代表着树中的一个节点。树起始于文档节点,并由此继续伸出枝条,直到处于这棵树最低级别的所有文本节点为止。

4、节点关系:

    1)、父节点

    2)、子节点

    3)、同级节点 ,同辈

    4)、后代节点    该节点下所有的节点都为它的后代节点

    5)、先辈节点    就相当于<html>节点是所有文本节点的先辈节点


 

5、dom访问的几种方法

    1)、document.getElementById("对象的id ");独立的访问某一个对象

    2)、document.getElementsByName("对象的name"); 返回的是一个数组(节点列表)

    3)、document.getElementsByTagName("标签名称");返回的也是一个对象数组

    4)、如何获取dom中所有的节点对象    document.all;

注意:

    第一个节点对象是w3c声明的规范(!)

    在获取table对象时会获取一个tbody节点属于表格

注意:

可以用document.all.id值   获取指定的id的对象

但是注意:我们获取的id值有多个,那么获取的就是一个节点的列表

可以通过document.all(下标值)  的方式获取网页对象

 

6、获取指定的对象的集合

all 返回对象所包含的元素集合的引用。

anchors 获取所有带有 name 和/或 id 属性的 a 对象的集合。此集合中的对象以 HTML 源顺序排列。

areas 获取给定 map 对象所定义的 area 对象集合。

attributes 获取对象标签属性的集合。

cells 获取表格行或整个表格中所有单元格的集合。

childNodes 获取作为指定对象直接后代的 HTML 元素和 TextNode 对象的集合。 

embeds 获取文档中所有 embed 对象的集合。

filters 获取应用于对象的滤镜集合。

fonts 获取所有系统支持的字体的集合。

forms 获取以源顺序排列的文档中所有 form 对象的集合。

frames 获取给定文档定义或与给定窗口关联的文档定义的所有 window 对象的集合。

images 获取以源顺序排列的文档中所有 img 对象的集合。

imports 获取为每个 styleSheet 对象定义的所有导入样式表的集合。

links 获取文档中所有指定了 HREF 属性的 a 对象和所有 area 对象的集合。

namespaces 获取 namespace 对象的集合。

options 获取 select 对象中option 对象的集合。

plugins 获取文档中所有 embed 对象的集合。

scripts 获取文档中所有 script 对象的集合。

styleSheets 获取代表与文档中每个 link 或 style 对象的实例相对应的样式表的 styleSheet 对象的集合。

 

7、当用dom修饰节点对象的css属性时都要加上  . style .

 

8、节点信息

   1)、nodeName    节点名称

   2)、nodeValue   节点值

   3)、nodeType    节点类型


nodeName

     元素节点的 nodeName 是标签名称

    属性节点的 nodeName 是属性名称

    文本节点的 nodeName 永远是 #text

     文档节点的 nodeName 永远是 #document

nodeName 所包含的 XML 元素的标签名称永远是大写的


nodeValue

    对于文本节点,nodeValue 属性包含文本。

    对于属性节点,nodeValue 属性包含属性值。

nodeValue 属性对于文档节点和元素节点是不可用的。

 


你可能感兴趣的:(HTML DOM简介)