prepend(content)和append(content)的用法

本文链接：https://blog.csdn.net/l277679541/article/details/38536383

prepend()方法和append方法基本相同，唯一的区别是prepend()方法添加的内容被放在制定元素的第一个子元素的位置，

而append()是把添加的内容放在最后一个位置

prepend(content)
向每个匹配的元素内部前置内容。

这是向所有匹配元素内部的开始处插入内容的最佳方式

示例：

向所有段落中前置一些HTML标记代码。

<p>I would like to say: </p>

$("p").prepend("<b>Hello</b>");

结果：

[ <p><b>Hello</b>I would like to say: </p> ]

将一个DOM元素前置入所有段落

<p>I would like to say: </p>
<p>I would like to say: </p>
<b class="foo">Hello</b>
<b class="foo">Good Bye</b>

$("p").prepend( $(".foo")[0] );

结果：

<p><b class="foo">Hello</b>I would like to say: </p>
<p><b class="foo">Hello</b>I would like to say: </p>
<b class="foo">Hello</b>
<b class="foo">Good Bye</b>

向所有段落中前置一个jQuery对象(类似于一个DOM元素数组)。

<p>I would like to say: </p><b>Hello</b>

$("p").prepend( $("b") );

结果：

<p><b>Hello</b>I would like to say: </p>

append(content)

向每个匹配的元素内部追加内容。

这个操作与对指定的元素执行appendChild方法，将它们添加到文档中的情况类似。

示例：

向所有段落中追加一些HTML标记。

<p>I would like to say: </p>

$("p").append("<b>Hello</b>");

结果：

[ <p>I would like to say: <b>Hello</b></p> ]