選択ボックスでjQueryのinsertAfter（）を使用する際のパフォーマンス上の問題はありますか？

Question

私は2つの "ページ"を持っています（基本的に2つのdivタグ、一度に1つしか表示されません）。ユーザーがどの「ページ」にいるかに応じて、選択ボックスはページ1（スライダ）のjQuery UIダイアログに表示されるか、通常の選択ボックスとしてページ2に表示されます。私の質問は、insertAfter（）を使って選択ボックスをあるページ/ divから別のページ/ divに移動できますか？それとも、もっと具体的には、私はすべきではない理由がありますか？私は、重複したIDを作成し、基本的に各選択ボックスのコピーを作成し、その値を同期しようとするとclone（）関数を嫌ってしまったのですが、insertAfter（）を使用しないのが正当な理由がない限り、ここで

は、コードのモックアップだ場合には私の説明は明快さを欠いていた：

HTML：

<div id="page1"> 
     <select id="tango"> 
      <option>Jester</option> 
     </select> 
    </div> 

<div id="page2"> 
    <div id="dialog"> 
     <!-- Select Menu would be inserted/moved here --> 
    </div> 
</div> 

はJavaScript：

$('select#tango').insertAfter('#dialog'); 

Answer 1

が実際につながる：

<div id="page2"> 
    <div id="dialog"> 

    </div> 
    <!-- Select Menu would be inserted/moved here --> 
</div> 

私はあなたがなりたい場所、あなたが本当にそれが置かれているしたいと思い何を思う：

$('select#tango').appendTo('#dialog'); 

Answer 2

私の質問があり、私がすることができますinsertAfter（）を使用して、選択ボックスを から1ページ/ divに移動しますか？または、具体的には、何か理由がありますか？ はすべきではありませんか？

いいえ、あなたはこれを行うことはできません。理由はありません。 $('select#tango').insertAfter('#dialog');スクリプトを使用して

Answer 3

それと間違って何もありません。ここで働いてデモhttp://jsfiddle.net/pomeh/FA23E/

HTMLコード

<div id="page1"> 
    <select> 
     <option>A</option> 
     <option>B</option> 
     <option>C</option> 
    </select> 
</div> 

<div id="page2"> 
    <div id="dialog"> 
     <!-- Select Menu would be inserted/moved here --> 
    </div> 
</div> 

<input type="button" value="Dance for me !" /> 

Javascriptコード

var clicks = 0, 
    $select = $("select"), 
    $targets = [ $("#dialog"), $("#page1") ]; 

$("input").on("click", function() { 
    var $target = $targets[ clicks++ % 2 ]; 

    $select.appendTo($target ); 
});