js的DOM编程艺术的学习笔记（一）

1.数组：用来存储一组值

数组的定义： 1. var sz = new Array（4）； 2. var sz = new Array() ;

3. var sz = new Array("1","2","3","4"); 4. var sz = ["1", "2", "3", "4"]

数组的元素：数组存储的元素不仅仅可以是字符串，也可以是数值，布尔类型等元素；更为厉害的是可以把各种类型的数据放在一个数组中：var sz = new Array ("zfc", 12, true); 同时数组的元素还可以是另外的一个数组： var sz1 = new Array("1”，"2", "3'); var sz2 = new Array(); sz2[0] = sz1;

2.对象：js的内建对象【Array, Date】和宿主对象【WEB浏览器提供的预定义对象：Image, Form, Element】以及用户自定义对象

3.DOM：文档对象模型。当创建一个网页并把他加载到web浏览器中时，DOM就在幕后悄然而生。它就会根据你编写的网页文档创建创建一个文档对象。四个非常实用的DOM方法：getElementById() ，getElementsByTagName, getAttribute 和setAttribute:

3.1：节点根据类型的不同分为：1.元素节点；2.属性节点；3.文本节点。

3.2：其中使用 getElementById("")获取到的是一个对象，该对象对应着文档中的一个元素节点。类似的getElemensByTagName返回的对象数组，也是对应的是元素节点数组

3.3 : 每一个节点都是一个对象。

3.4元素节点和属性节点以及文本节点之间的关系：

提问<>文本节点和元素节点为父子关系，但是属性节点和元素节点是兄弟关系吗？如果是兄弟关系，
那么通过“元素对象.属性名”的方式访问属性怎么解释？究竟元素节点和属性节点什么关系呢？

参照图：


4:DOM的总结：文档中给的每一个元素都对应着一个对象

5：DOM中的this关键字 代表“这个操作对象”

6：DOM中的其他的属性： object.shuxing 这种引用方式

6.1 : childNodes:返回所有的子节点（所有类型的节点对象都包含在内，属性节点，文本节点以及元素节点等，在document文档中，几乎所有的东西都被解释为节点，甚至空格和换行符都成为节点，他们都包含在childNodes返回的属性数组中）【遍历所有的子节点】

6.2 : 使用node.nodeType可以分区文档中的各个不同类型的节点：其中元素节点的nodeType为1；属性节点的nodeType为2；文本节点的nodeType为3.【获取子节点的所属类型】

6.3：使用nodeValue获取某一个节点的文本值【获取节点的文本值：例如<p>My Test<p>中 p元素节点的nodeValue 为 null ; 我们要想获取到My Test 文本，需要 p。childNodes[0].nodeValue来获取。因为My Test 文本节点对象是p元素节点的第一个子节点。 nodeValue是用来返回文本节点的文本值，对弈元素节点返回 null】

6.3.1：通过getElementById("")获取到元素节点对象，进而通过 getAttributeNode("属性名")得到对应的属性节点对象，同时可以通过firstChild来获取到文本节点对象。

6.4：

"window.location.href"、"location.href"是本页面跳转

"parent.location.href"是上一层页面跳转

"top.location.href"是最外层的页面跳转

６.5 : node.firstChild 等价于 childNodes[0]; node.lastChild