在找到的结果的前面或者后面追加新的内容，可以使用 .prepend() … 或者 .append() … 我们也可以使用 .prependTo() 还有 .appendTo() ，把找到的结果追加到某个位置的前面或者后面 …

下面我们还是通过几个简单的测试，去理解一下这几个方法 …

比如我们要在页面这些图像的上方去追加一些内容 … 用的方法是 .prepend() …

测试

先选中图像的父元素 … 就是这个带有 .album 类的 div .. 然后调用它的 .prepend() 方法 …

$( '.album' ).prepend( '<h6>Coldplay</h6>' );

要追加的内容是一组标题，里面的内容是 Coldplay ….

你会看到，会在选择的每个元素的上方去添加这个指定的内容 … 如果想在它的下方去添加内容，使用的方法是 .append() …

先刷新一下 … 再把这个 prepend() 换成 append()

$( '.album' ).append( '<h6>Coldplay</h6>' );

现在这个标题会在 .album 元素里的最后这个位置 …

.appendTo()

.appendTo() 可以把指定的内容，添加到指定的位置上 … 像这样 … 可以把前面指定的这个标题追加到 .album 元素里的最后面 …

$( '<h6>Coldplay</h6>' ).appendTo( '.album' )

.prependTo()

最后再试一下 .prependTo();

$( '<h6>Coldplay</h6>' ).prependTo( '.album' )

它可以把指定的内容追加到指定位置里的最前面 …