appendとnth-childの組み合わせ 追加されない

Question

appendとnth-childを組み合わせて使ったとき、『追加』ではなく『順番入れ替え』という結果になる理論が知りたいです。

『魚.jpg』『猿.jpg』『人間.jpg』の3つの写真があるとします。
jQuery上で、appendメソッドを使用し『1番最初の写真を(つまり『魚.jpg』のこと)最後に追加しなさい』という指示をするとします。
実行結果は、猿・人間・魚の順で3つの写真が並びます。

魚・猿・人間・魚、と4つの写真が並ぶのではなく、猿・人間・魚、という風に、『追加』ではなく『順番入れ替え』という結果になるのは何故なのでしょうか？
そういうものだと覚える他ないですか？

該当のソースコード

<div>
    <img src="fish.jpg">
    <img src="monkey.jpg">
    <img src="human.jpg">
</div>

var $first = $('div img:first-child');

$('div').append($first);

Answer 1

そういうものだと覚える他ないですか？

マニュアルを確認しましょう。

If an element selected this way is inserted into a single location elsewhere in the DOM, it will be moved into the target (not cloned)

Comments

[maisumakun]

普段使っている関数でも、マニュアルを見ると知らなかったことが書かれている、ということもよくあります。

[yukarichang]

複製されないルールなんですね。これからはマニュアルを見る癖をつけようと思います。ありがとうございました。