书中提供了一个小的案例来讲述DOM控制页面节点树的方法，我将这个过程比较详细的写了一遍，确实很实用！虽然使用方法比innerHTML繁琐些，但是可以非常精确控制每一个节点的位置，还可以把这个节点做成一个全局变量（这个是我看到这里自己总结的，应该是成立的），以后随时可以调用！
下面内容包括代码，我都是在markdown编辑器下手敲的，目的是为了在这个过程中，能再写一遍代码，对这些代码能加深印象
如果文字敲错了大家就当没看见，代码敲错了我相信能看出来的不会看我这种小白的blog，看不出来复制过去报错的，请留言哈。
createElement方法
createElement方法是在页面中创建一个新的元素，但这个元素是没有父元素的，它只是游荡在这个脚本中，不会被页面显示出来但实际上是存在的。
格式：
document.createElement(nodeName);
例如在一个空的HTML文件中创建一个元素p：
<script type="text/javascript">
document.createElement("p");
</script>
书中讲到，创建了一个元素后把它赋值给一个变量是一个不错的选择，这样方便后续调用：
<script type="text/javascript">
var para = document.createElement("p");
</script>
appendChild方法
这个方法可以把createElement创建的元素插入页面中某个指定的元素节点下，使其成为这个元素的子节点。
格式：parent.appendChild(child);
例子：
<div id="testdiv">
</div>
上面这个HTML是一个空的ID为testdiv的div，我想将上面创建的那个P元素插入这个div中：
<div id="testdiv">
</div>
<script type="text/javascript">
var para = document.createElement("p");
document.getElementById("testdiv").appendChild(para);
</script>
得到的结果是（我在浏览器中F12截图的）：
可以看到，这个空的P标签已经成功插入到ID为testdiv的div标签下，成为它的子元素了。但这么写我觉得有点太长了，可以换成下面的写法：
<div id="testdiv">
</div>
<script type="text/javascript">
var para = document.createElement("p");
var testdiv = document.getElementById("testdiv");
testdiv.appendChild(para);
</script>
个人觉得这种写法更容易调试代码，灵活性更高些！
切记：
parent.appendChild(child);中的child是不带引号的，因为我在上面已经把这个元素存入了一个变量中，我在写的时候就因为这个问题，撒泼打滚的一个字一个字的对着书本的代码查了好半天才反应过来。
当然，我是小白才会因为这种基础的常识问题卡住，大神们请直接忽略！
createTextNode方法
上面讲的使用createElement创建一个空的元素p，并用appendChild插入了指定的div中，现在就可以使用createTextNode来为这个p元素创建内容，创建的形式也是和createElement一样，出来的也是一个浮游的文本元素。
格式：document.createTextNode(text);
例如：
document.createTextNode("This is mt blog!");
//var text = document.createTextNode("This is mt blog!");
//我一般习惯在创建元素的时候马上赋值给一个变量，方便后面使用
文本内容创建好了之后，就可以再使用appendChild方法，插入到p标签下了：
var text = document.createTextNode("This is mt blog!");
para.appendChild(text);
整个过程完整的代码如下：
<div id="testdiv">
</div>
<script type="text/javascript">
//创建一个空的p元素并赋值给变量para
var para = document.createElement("p");
//找到指定的id的div
var testdiv = document.getElementById("testdiv");
//将这个para插入到指定的div下
testdiv.appendChild(para);
//创建一个文本元素，值为：This is my blog
var text = document.createTextNode("This is my blog!");
//将这个文本元素插入到p标签下
para.appendChild(text);
</script>
最终的显示结果如下：
排版需要，我把浏览器放大了，实际上的This is my blog!显示出来是默认的字号和字体！
