append, appendTo, after区别（preappend、before与这几个原理相同）

append在被选元素结尾插入内容，是被包围在所选元素的标签内的。

1 <script>
2     $('p').append('<a>http</a>');
3 </script>
4 
5 <body>
6   <p>在p标签内插入内容</p>
7 </body>

//结果是：

<p>在p标签内插入内容<a>http</a></p>

appendTo在被选元素结尾插入内容，是被包围在所选元素的标签内的。他的方向和append相反。

1 <script>
2      $('<a>http</a>').appendTo('p');
3 </script>
4  
5 <body>
6    <p>在p标签内插入内容</p>
7 </body>

//结果是：

<p>在p标签内插入内容<a>http</a></p>

after在被选元素之后插入内容，是在所选元素的标签外的。

1 <script>
2     $('p').after('<a>http</a>');
3 </script>
4 
5 <body>
6    <p>在p标签内插入内容</p>
7 </body>

//结果是：

<p>在p标签内插入内容</p><a>http</a>