JavaScript DOM 编程艺术[第2版] 学习笔记
# JavaScript DOM 编程艺术[第2版] 学习笔记
## 语法
### 使用
1. 在`<head></head>`部分包含一个`<script>`标签；
2. 将js代码存入`.js`文件中，在HTML文件中通过`src`属性指向该文件；
3. 最好还是在`</body>`标签之前通过`src`指向js文件；
4. 不需要编译器，仅需要解释器；
### 语句
1. 建议分行并且句末添加 ';' ，便于阅读；
### 注释
1. `//`注释；
2. `/* */`注释；
3. `<!-`注释，此注释仅单行注释，会忽略句末的`-->`；
### 变量
1. 可以不声明变量，直接赋值；
2. 先声明变量，再赋值；
3. 声明变量的同时，进行赋值，可以对多个变量进行这样的操作，eg：`var mood = "happy", age = 34;`
### 数据类型
1. 字符串
2. 数值
3. 布尔值
4. 数组，要使用Array来声明，声明的同时可以给出长度；
eg：`var members = Array(3);`；
也可以不给出长度：
eg：`var members = Array();`；
也可以在声明时初始化：
eg：`var members = Array("father", "mother", "son")`；
也可以不给出Array关键字，如python中，使用`[]`来创建数组；
5. 关联数组（字典、哈希表）
```javascript
var lennon = Array();
lennon['name'] = "john";
lennon['year'] = 1940;
lennon['living'] = false;
```
字典中的value也可以是字典；
数组中的元素可以是不同数据类型的数据，也可以是关联数组；
### 操作
#### 算数操作符
1. `+、-、*、/`
2. `自增自减`；
3. `+=`
#### 条件语句
1. `if、else`
2. `>、<、>=、<=、==、!=`
3. `&&、||、!`
#### 循环语句
1. `while`
2. `do...while`
3. `for(;;)`
### 函数
1. `function 函数名(参数){}`；
2. `return`
### 变量的作用域（scope）
1. 在函数中使用`var`声明的变量都将变成局部变量；
### 对象（object）- 用户定义对象
1. 拥有**属性**和**方法**；
2. 用户使用“点”语法访问属性与方法；
3. 为给定对象创建一个新实例：
eg：`var jack = new Person;`；
### 内建对象（native object）
1. `Array`；
2. `Math`；
3. `Date`；
### 宿主对象（host object）
1. > 由Web浏览器提供的预定义对象被称为宿主对象（bost object）；
2. 主要包括`Form`、`Image`、`Element`
---
## DOM
> DOM代表着被加载到浏览器窗口里的当前网页；浏览器向我们提供了当前网页的模型（地图），我们可以通过JavaScript去读取这张地图；
### DOM中的节点
1. 元素节点；
2. 文本节点；
3. 属性节点（并非所有元素都包含这属性，但所有的属性都会被包含在元素里）；
4. 注释节点；
#### 挂钩属性（css选择器？）
1. class属性
2. id属性
#### 常用函数
1. `getElementByID()`；返回一个对象
2. `getElementsByTagName()`；
返回一个数组；
支持通配符参数，如'*'；
3. `getAttribute(attribute)`；
4. `setAttribute(attribute, value)`；
通过此函数对文档进行修改，将使得文档在浏览器窗口中的显示效果 和/或 行为动作发生相应的变化，但是通过view source时，文档的源代码不变；
DOM的工作模式，造就了这种“表里不一”的现象：
加载文档的静态内容 -> 以动态的方式对它们进行刷新 -> 动态刷新不影响文档的今天内容；
