DOM2  动态创建节点

1.生成节点的方法  document.createElement（“div”）

2.插入节点方法   父元素.appendChild（新节点）

          在父级节点中的子节点后面插入新的节点

3.在指定位置插入新的节点

    （1）父元素.innerBefore（新节点，谁的前面）将新的节点插入指定的元素前面

4.删除元素节点   父元素.removeChild（）

案例分析

        仿留言版

       兼容性

       元素没有子节点，ie低版本会读取不到，而标准浏览器会。

       因为标准浏览器会把文本节点当作子节点，而ie6-8不会。

超链接a的属性href分析

       <a href="">点击会刷新页面，相当于向后台发送一次请求。

       <a href="#s">锚点跳转   跳转到某一个id叫s的位置上

       <a href="javascript:;">取消刷新页面的功能

拓展

       字符串拼接和DOM创建都是渲染的方式

       字符串拼接

               优点   简单，层次感强，可以处理大量的数据

               缺点：字符串拼接会影响到原有子元素的事件

        Dom创建

              优点：是一个独立的个体，不会影响到原有的元素

              缺点：处理数据量过大会比较麻烦，会造成DOM回流。

       Dom回流

         页面渲染时，我们对html结构简单的增删查改时，浏览器会对所有的dom进行重新排列这就是Dom回流，严重影响浏览器的性能。

 

       补充：

                 提升页面性能的优化

                           1.多采用雪碧图

                           2.阻止超链接的默认行为

                           3.减少Dom回流

                           4.减少向服务器请求的次数