如何在JavaScript中訪問DataList的子項？

Question

我想通過javascript在項目模板中的DataList中動態構建div元素。 我想過構建一個面板，然後使用panel.appendChild（div），但我不知道如何得到它。 是否有可能在JavaScript中做到這一點？在datalist'children'中調用控件是否正確？ 如果是，我會很樂意提供一些幫助。

var but2 = document.getElementById("Button2"); 
     var dl = document.getElementById("DataList1"); 
     var p = dl.children[0]; 
     but2.onclick = function CopyDiv() { 
      var iDiv = document.createElement('div'); 
      iDiv.style.width = "200px"; 
      iDiv.style.height = "200px"; 
      iDiv.style.position = "absolute"; 
      iDiv.style.top = "10px"; 
      iDiv.style.left = "10px"; 
      iDiv.style.border = '1px solid black'; 
      p.appendChild(iDiv); 
     } 

這是錯誤的代碼，我猜是因爲我沒有任何對ItemTemplate的引用。

Answer 1

我在代碼中第一次看到一個問題，如果DataList是一個div和BTN的一個按鈕做到這一點：

<input type="button" id="Button2" onclick="CopyDiv()" val="append" /> 

    <script type="text/javascript"> 
    var dl = document.getElementById("DataList1"); 
    var p = dl.children[0]; 

    function CopyDiv() { 
     var iDiv = document.createElement('div'); 
     iDiv.style.width = "200px"; 
     iDiv.style.height = "200px"; 
     iDiv.style.position = "absolute"; 
     iDiv.style.top = "10px"; 
     iDiv.style.left = "10px"; 
     iDiv.style.border = '1px solid black'; 
     p.appendChild(iDiv); 
    } 
    </script>