.append（），prepend（），.fter（）和.before（）

我非常精通编码，但是时不时地遇到了似乎基本上做同一件事的代码。我的主要问题是，你为什么要使用.append()而不是.after()还是恶习的经文？

我一直在寻找，似乎找不到对两者之间以及何时使用以及何时不使用的明确定义。

一个人比另一个好处有什么好处，为什么我会使用一个而不是另一个？有人可以向我解释一下吗？

var txt = $('#' + id + ' span:first').html();
$('#' + id + ' a.append').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').append(txt);
});
$('#' + id + ' a.prepend').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').prepend(txt);
});
$('#' + id + ' a.after').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').after(txt);
});
$('#' + id + ' a.before').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').before(txt);
});

答案

看：

.append()将数据放入元素中last index和
.prepend()将预备元素放在first index

认为：

<div class='a'> //<---you want div c to append in this
  <div class='b'>b</div>
</div>

什么时候.append()执行它看起来像这样：

$('.a').append($('.c'));

执行后：

<div class='a'> //<---you want div c to append in this
  <div class='b'>b</div>
  <div class='c'>c</div>
</div>

在执行中使用.append（）提出。

什么时候.prepend()执行它看起来像这样：

$('.a').prepend($('.c'));

执行后：

<div class='a'> //<---you want div c to append in this
  <div class='c'>c</div>
  <div class='b'>b</div>
</div>

在执行中使用.prepend（）。

.after()将元素放在元素之后
.before()将元素放在元素之前

使用以下：

$('.a').after($('.c'));

执行后：

<div class='a'>
  <div class='b'>b</div>
</div>
<div class='c'>c</div> //<----this will be placed here

执行中的.fter（）。

在之前使用：

$('.a').before($('.c'));

执行后：

<div class='c'>c</div> //<----this will be placed here
<div class='a'>
  <div class='b'>b</div>
</div>

在执行中使用.before（）。

来自: stackoverflow.com