prepend（）和prependTo（）之间的区别

Question

我无法理解prepend（）和prependTo（）之间的区别。有人可以帮我理解差异。

Answer 1

这真的只是为了链接。

x.prependTo(y)

将x添加到y并返回原始集合x。

y.prepend(x)

还会将x添加到y，但会返回原始集y。

Answer 2

根据prepend

的jQuery文档

  

.prepend()和.prependTo()方法执行相同的任务。主要区别在于语法特定，内容和目标的放置。对于.prepend()，方法前面的选择器表达式是插入内容的容器。另一方面，使用.prependTo()，内容在方法之前，作为选择器表达式或动态创建的标记，并将其插入目标容器中。

---

一些例子：

prepend示例1

<div id="a">
    <p>a</p>
</div>
<div id="b">
    <p>b</p>
</div>
<script>
    $('#a').prepend('#b');
</script>

结果为*：

<div id="a">
    #b
    <p>a</p>
</div>
<div id="b">
    <p>b</p>
</div>

这是因为prepend将字符串视为HTML内容而不是选择器

prepend示例2

<div id="a">
    <p>a</p>
</div>
<div id="b">
    <p>b</p>
</div>
<script>
    $('#a').prepend($('#b'));
</script>

结果：

<div id="a">
    <div id="b">
        <p>b</p>
    </div>
    <p>a</p>
</div>

prependTo示例3

<div id="a">
    <p>a</p>
</div>
<div id="b">
    <p>b</p>
</div>
<script>
    $('#a').prependTo('#b');
</script>

结果为*：

<div id="b">
    <div id="a">
        <p>a</p>
    </div>
    <p>b</p>
</div>

为了使代码可读，

_{*空格在这些示例中是错误的}

Answer 3

Copied directly from the docs

  

.prepend（）和.prependTo（）方法执行相同的任务。该   主要区别在于语法特定，在放置中   内容和目标。使用.prepend（），选择器表达式   在该方法之前是内容所在的容器   插入。另一方面，使用.prependTo（），内容先于   该方法，作为选择器表达式或作为标记创建   苍蝇，它被插入目标容器。

基本上说

ElementWhereIWantToAppendTo.prepend(This Is The Content That Is Added)
ElementIWantToAdd.prependTo(This Is Where I add The Content)