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

时间:2022-05-24 20:34:09

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>