页面上append的用法 注意

在页面开发过程中append（）函数是经常会用到的，今天遇到了一个很有意思的问题，这里来自我总结一下把！

定义和用法

    append() 方法在被选元素的结尾（仍然在内部）插入指定内容。

今天页面的需求是用ajax查询后台数据，追加到页面的div中；这里需要说明一下的是向div追加的是一个table，这个table是由后台查询的数据拼接而成，再追加到div；

我遇到是啥问题那，就是我追加的table样式，全乱了，根本不是我想要的样式，但怎么调试也调试不好，最后F12看了一下页面我拼接的table就发现问题了，我写的是比较规范的html语言，但我在F12看页面的代码时，发现全乱了，完全是这样的

 1.   <table></table>

 2.    <tr></tr>

 3.     </ tr>

  4.   </table>

     问题就在这里，第 1行和第2行红的代码 根本不是我写的，我就纳闷了，最后发现我的代码有问题：我的写法是：

    $("#result").append("<table>");

     $("#result").append("<tr>"); 

    .........................................

     最后改为：

      var resultContent="";

       resultContent+="<table>";

      resultContent+="<tr>";

      ..................................

     $("#result").append(resultContent);

这样就ok了，追加的样式也没有问题了，这里出现的问题就是，用append（）追加成对的标签时，必须要一次性追加，如果开始标签和结束标签一个一个追加的话，浏览器会自动给你补上结束标签，这样反而会画蛇添足，无事生非！

ps：我用的是谷歌浏览器，至于其他的浏览器我也就不知道了！