动态创建元素的三种方式；
一、document.write()；
功能：向body的最后添加一段结构；
参数：字符串；
用法：document.write('这是内容<div>这是div</div>')；
问题：
1、如果页面加载后使用会导致页面所有内容被覆盖；
2、无法进行指定位置添加元素；
二、box.innerHTML = '要添加的元素';
优点
1、可以指定位置添加元素；
2、创建复杂结构非常方便；换行的话需要进行基本的字符串处理使用转译符；
box.innerHTML = '<div><p class="text colorRed"></p></div>
<div><p class="text fl"></p><span><a href="#">这是a标签</a></span></div>
<div><p class="text fl"></p><h4>这是h4</h4></div>
<div><p class="text fl"></p><span><a href="#">这是a标签</a><h4>这是h4</h4></span></div>
<div><p class="text colorRed"><span><a href="#">这是a标签</a></span></p></div>';
缺点；
1、会对原有的元素内部结构进行覆盖； 解决方法是使用 += 可以貌似解决覆盖问题，但只是长得像并不是原来的内部元素；如果被覆盖的事件有事件，那么事件将不复存在；
三、createElement创建元素（常用）
用法 ： createElement('<div></div>');
要结合appendChild() 或 insertBefore();使用
功能：用于创建指定标签
参数：字符串形式的标签名；
特点：使用此方法创建的元素默认不在页面上显示，需要结合元素的移动功能才可以显示；
总结：当要创建的结构比较复杂时，用 ：innerHTML;
除了结构复杂的情况外都可以使用document.createElement();
四、删除节点
父节点.removeChild(text);