bootstrap 学习之路 10 (javascript DOM 编程)

1  DOM 简介

1.      DOM 包括三部分 core DOM   XML  DOM    HTML DOM(网页编程使用HTML DOM)

2.      Html DOM 定义了对象的属性和访问API

3.      Javascript操作DOM，实际就是对HTML DOM节点的增删改查 add delete get change

 

2  HTML  节点

2.1 在W3C协议中everything 都是节点

1.      整个网页时一个document 节点

2.      每一个html 元素就是一个元素节点

3.      内部文本是文本节点

4.      Html属性是属性节点

5.      注释是注释节点

 

2.2 Parents（父节点） 、children（子节点）、siblings（兄妹节点）

1.      最顶层节点被称为root

2.      没一个节点都有且只有一个父节点。 Root节点没有父节点

3.      一个节点可以有任意多个子节点

4.      所有的Sibling节点共有一个父节点

 

2.3 注意：

<title>DOM Tutorial</title> 表示元素节点title包含一个文本节点，文本几点的内容就是DOM Tutorial. 而不是元素节点title包含文本节点。

3 Html DOM methods

方法就是你可以对节点进行的操作。没一个DOM元素都是一个对象，每一个对想都有方法和属性。方法是你可以对节点做什么。属性是节点自身属性，可以进行set和get

 

3.1 常用方法：

getElementById(id)  获取一个node通过id

getElementsByTagName(sname) 通过名字来获取元素列表

getElementsByClassName(sname) 通过类名来获取元素列表

 

 

appendChild(node)  新增一个节点

removeChild(node)  删除一个节点

replaceChild(node)   替换一个节点

insertBefore(node)   在一个节点前面插入一个节点

 

createAttribute