9

私は次のdivような要素を持っています

<div id="move">Something</div>

... DOM内のある位置から別の位置に移動したいと思います。私はこれを次appendTo()のように行うことができますか？

$('#move').fadeOut(500, function() {
   $(this).appendTo('#another-container').fadeIn(500);
});

...またはこれはそれを複製しますか？

id複製されている場合、DOMには同じ要素が2つあります。どうすればこれを回避できますか？

4

3 に答える 3

15

はい、appendToメソッドはDOMツリーから要素を移動します。要素をコピーする場合は、.clone()が使用されます。

例：

Body:   <div>
           <a>Test</a>
        </div>
        <span></span>
jQuery code:
   $("a").appendTo("span");

After:  <div></div>
        <span>
           <a>Test</a>
        </span>
于 2011-11-24T20:46:38.693 に答える
6

jQueryのドキュメントhttp://api.jquery.com/append/から直接取得しました

$( ".container" ).append( $( "h2" ) );

「この方法で選択された要素がDOMの他の場所の単一の場所に挿入された場合、その要素はターゲットに移動されます（複製されません）：」

于 2014-06-19T21:46:35.510 に答える
0

.appendまたは.afterまたは同様の方法でそれを行うことができます。

<ul class="list1">
  <li>You wanted to move this element!</li>
  <li>Element 2</li>
  <li>Element 3</li>
</ul>

<ul class="list2">
  <li></li>
  <li>Element 2</li>
  <li>Element 3</li>
</ul>

<button onclick="moveIt()">Move element</button>

したがって、最初の.liをから.list1に移動するコードは次のように.list2なります。

function moveIt() {
  var elementToBeMoved = $(".list1 li:first");
  $(".list2 li:first").append(elementToBeMoved);
}

作業ペン

于 2017-06-14T16:19:45.130 に答える