克隆div內的所有元素和內容並將其顯示到另一個div中

Question

獲取特定div內的所有元素並將其顯示爲與其他div相同。 裏面的內容是動態的。 我想克隆的所有元素中 即

<div id="div_preview"> 
    <br> 
    2 php Developer ?<br> 
    <input type="checkbox" name="chk_0" value="a"> 
    a 
    <input type="checkbox" name="chk_1" value="b"> 
    b 
    <input type="checkbox" name="chk_2" value="c"> 
    c 
    </div> 

from <div id="div_preview"> and display it to <div id='other_div'></div> 

使O/P

<br> 
     2 php Developer ?<br> 
     <input type="checkbox" name="chk_0" value="a"> 
     a 
     <input type="checkbox" name="chk_1" value="b"> 
     b 
     <input type="checkbox" name="chk_2" value="c"> 
     c 

Answer 1

document.getElementById('other_div').innerHTML = document.getElementById('div_preview').innerHTML; 

Answer 2

顯示在警報：

$(document).ready(function(){ 
     alert($('#div_preview').html());  

    }); 

Answer 3

$("button").click(function{ 
var result=$('#div_preview').html(); 
$("other_div").html(result); 
}); 

Answer 4

您可以使用contents爲此 - 只需克隆內容，然後將克隆的元素添加到新容器中。

下面是一個例子：

$('#div_preview').contents().clone().appendTo('#div_container')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div_preview"> 
 
    <br> 
 
    <input type="checkbox" name="chk_0" value="a"> 
 
    a 
 
    <input type="checkbox" name="chk_1" value="b"> 
 
    b 
 
    <input type="checkbox" name="chk_2" value="c"> 
 
    c 
 
</div> 
 
<br /> 
 

 
<div id="div_container"></div>