JAVASCRIPT的第八天

1、DOM的概念

dom（文档对象模型），作为HTML（结构，内容，样式  ）和JAVASCRIPT的接口；

通过DOM可以访问所有的HTML元素，连同他们的属性和文本，同时也可以进行修改和删除并且创建新的元素；

加载HTML页面时，DOM根据html内容描绘一个层次化的节点树。

1、节点的分类

1）元素节点：   <div>.......</div>

   2）属性节点：  title="123",,,class="demo"

   3）文本节点：  我是文字

 

2、节点的定位

1）getElementById();

   2）getElementsByTagName();

           3）getElementsByClassName();

   4）getElementsByName();

2、3、4都是返回一个数组

5）firstChild;

   6）lastChild;

   7）previousSibling;

   8）nextSibling;

   9）parentNode;

           10）childNodes;（数组）

3、节点的属性

1）

getAttribute()//获取指定节点的属性值

 //也可以通过点语法的形式访问节点属性（点语法不能访问自定义属性）；

  setAttribute()//为指定节点设置属性，接受两个参数：第一个为属性名，第二个为属性的值(可以自定义属性)

  removeAttribute()//移除指定节点的属性

 2）   三个重要属性：nodeName、nodeType、nodeValue

3）

childNodes属性： 某个元素节点的所有子节点，这些节点包括元素子节点和文本子节点

childNodes.length:子节点总数

childNodes[1]:下标为1的子节点

4、innerHTML和nodeValue

区别：1）取值

innerHTML：只能获取元素节点里面的内容，把标签也会进行输出

nodeValue：只能获取文本节点的内容和属性节点的值。

2）赋值

innerHTML：可以解析内部的HTML标签；

nodeValue：会把包含在文本的HTML标签按原样输出；

5、innerHTML、innerText、outHTML

innerHTML:把对象从起始位置到终止位置的全部内容，包括HTML标签也输出；

innerText:从起始位置到终止位置的内容, 但它去除Html标签;

outerHTML:除了包含innerHTML的全部内容外, 还包含对象标签本身.

innerText和outHTML不是w3c标准，而innerText不适用火狐浏览器。