2011-01-11 108 views
3

我想克隆純Javascript中的div,但cloneNode導致重複的id(div_0)。我想遞增id作爲div_1,div_2 ...和做同樣的somevar = { 'ELEM', 'div_1'} ...謝謝JavaScript中的克隆元素[div] [腳本]

<html> 
<head></head> 
<body> 
<div id="mydiv"> 
    <div id="div_0"> 
     <script type="text/javascript"> 
      <!-- 
      somevar = {'elem', 'div_0'}; 
      //--> 
     </script> 
     <p>HELLO</p> 
    </div> 
</div> 

<a href="#" onclick="cloning()">CLONE</a> 

<script type="text/javascript"> 
    function cloning() { 
     var container = document.getElementById('mydiv'); 
     var clone = document.getElementById('div_0').cloneNode(true); 
     container.appendChild (clone); 
    } 
</script> 
</body> 
</html> 
+0

你是什麼意思在`somevar`中做同樣的事情? – 2011-01-11 17:29:00

+0

基本上只是一個var,它保存父div的值。請忽略名稱 – Mike 2011-01-11 17:30:57

+0

您需要更具體。在關閉一個新div後,請顯示`somevar`對象的最終結果。請不要以爲我知道你想要什麼。順便說一下,該語法無效。它必須是一個關鍵:價值,或者你必須把它作爲一個數組。 – 2011-01-11 17:45:51

回答

1

設置counter=0,然後將每個cloning調用之後遞增與counter++和使用clone.id並將其設置爲'div_' + counter

4

試試這個..

`

function cloning() { 
    var container = document.getElementById('mydiv'); 
    var clone = document.getElementById('div_0').cloneNode(true); 
    clone.setAttribute('id','div_'+document.getElementById('mydiv').getElementsByTagName('div').length); 
    container.appendChild (clone); 
} 

`

0

我還沒有機會測試這一點,但是這可能做的伎倆:如果您想更新的地方全局變量

function cloning (e) { 
    if (typeof e === 'string') { 
     e = document.getElementById(e); 
    } 

    var clone = e.cloneNode(true), 
     last_inc = cloning.last_inc || parseInt(e.id.match(/(\d+)$/)[0], 10); 

    last_inc += 1; 

    clone.id = 'div_' + last_inc; 
    cloning.last_inc = last_inc; 

    e.parentNode.appendChild(clone); 
} 

,你可以做return { "elem" : "div_" + last_inc };和分配結果功能。或者不用回報,您可以明確地完成任務。我會推薦前者。