From b15f81617dd9065d4079dcf259e7fc35348aa758 Mon Sep 17 00:00:00 2001
From: qianguyihao <qianguyihao@gmail.com>
Date: Tue, 3 Dec 2019 19:11:10 +0800
Subject: [PATCH] fix #71

---
 04-JavaScript基础/01-JS简介.md           |  4 +--
 04-JavaScript基础/22-DOM简介和DOM操作.md | 33 +++++++++++++++---------
 2 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/04-JavaScript基础/01-JS简介.md b/04-JavaScript基础/01-JS简介.md
index f72c1f6..5bc47e0 100644
--- a/04-JavaScript基础/01-JS简介.md
+++ b/04-JavaScript基础/01-JS简介.md
@@ -126,13 +126,13 @@ JavaScript基础分为三个部分：
 
 > 由于少了实现编译这一步骤，所以解释型语言开发起来尤为方便，但是解释型语言运行较慢也是它的劣势。不过解释型语言中使用了JIT技术，使得运行速度得以改善。
 
-### 编程语言的分类
+### 补充知识：编程语言的分类
 
 > 所谓的“翻译”，指的是编译成计算机能够执行的指令。
 
 **编译型语言**：
 
-- 定义：事先把所有的代码 一次性翻译好，然后整体执行。比如说，c语言的代码文件是`.c`后缀，翻译之后文件是`.obj`后缀（系统执行的是 obj 文件）；再比如， java 语言的代码文件是`.java`后缀，翻译之后的文件是`.class`后缀。
+- 定义：事先把所有的代码 一次性翻译好，然后整体执行。比如说，c语言的代码文件是`.c`后缀，翻译之后文件是`.obj`后缀（系统执行的是 obj 文件）；再比如， java 语言的代码文件是`.java`后缀，翻译之后的文件是`.class`后缀。（注意，Java 语言不是严格的 编译型语言，这个一会儿会讲）
 
 - 优点：运行更快。
 
diff --git a/04-JavaScript基础/22-DOM简介和DOM操作.md b/04-JavaScript基础/22-DOM简介和DOM操作.md
index 7c88830..a1aa6e8 100644
--- a/04-JavaScript基础/22-DOM简介和DOM操作.md
+++ b/04-JavaScript基础/22-DOM简介和DOM操作.md
@@ -414,7 +414,7 @@ JS中的**父子兄**访问关系：
 方式2：
 
 ```javascript
-	元素节点.setAttribute(属性名, 新的属性值);
+	元素节点.setAttribute("属性名", "新的属性值");
 ```
 
 方式2举例：（设置节点的属性值）
@@ -442,18 +442,28 @@ JS中的**父子兄**访问关系：
 ```
 
 
+### 总结
 
-**总结：**
+获取节点的属性值和设置节点的属性值，都有两种方式。
 
-获取节点的属性值和设置节点的属性值，都有两种方式，但这两种方式是有区别的。
+**如果是节点的“原始属性”**（比如 普通标签的`class/className`属性、普通标签的`style`属性、普通标签的 title属性、img 标签的`src`属性、超链接的`href`属性等），**方式1和方式2是等价的**，可以混用。比如说：用 `div.title = '我是标题'`设置属性，用 `div.getAttribute('title')`获取属性，就是混用。
 
-- 方式一的`元素节点.属性`和`元素节点[属性]`:绑定的属性值不会出现在标签上。
+但如果是节点的“非原始属性”，比如：
 
-- 方式二的`get/set/removeAttribut`: 绑定的属性值会出现在标签上。
+```javascript
+div.aaa = 'qianguyihao';
 
-这其实很好理解，方式一操作的是属性而已，方式二操作的是标签本身。
+div.setAttribute('aaa', 'qianguyihao');
 
-另外，需要注意的是：**这两种方式不能交换使用**，get值和set值必须使用用一种方法。
+```
+
+上面的这个“非原始属性”，在使用这两种方式时，是有区别的。区别如下：
+
+- 方式1 的`元素节点.属性`和`元素节点[属性]`：绑定的属性值不会出现在标签上。
+
+- 方式2 的`get/set/removeAttribut`：绑定的属性值会出现在标签上。
+
+- **这两种方式不能交换使用**，get值和set值必须使用同一种方法。
 
 举例：
 
@@ -478,17 +488,16 @@ JS中的**父子兄**访问关系：
 </body>
 ```
 
-## DOM对象的属性
 
-DOM对象的属性和HTML的标签属性几乎是一致的。例如：src、title、className、href等。
+## DOM对象的属性-补充
 
 ### innerHTML和innerText的区别
 
 - value：标签的value属性。
 
-- **innerHTML**：双闭合标签里面的内容（识别标签）。
+- **innerHTML**：双闭合标签里面的内容（包含标签）。
 
-- **innerText**：双闭合标签里面的内容（不识别标签）。（老版本的火狐用textContent）
+- **innerText**：双闭合标签里面的内容（不包含标签）。（老版本的火狐用textContent）
 
 
 **获取内容举例：**
@@ -505,7 +514,7 @@ DOM对象的属性和HTML的标签属性几乎是一致的。例如：src、titl
 
 这里讲一下nodeType属性。
 
-- **nodeType == 1  表示的是元素节点**（标签） 。记住：元素就是标签。
+- **nodeType == 1  表示的是元素节点**（标签） 。记住：在这里，元素就是标签。
 
 - nodeType == 2  表示是属性节点。