如何在html表中動態創建帶有div類的輸入元素？

Question

我可以在 html 表中動態創建輸入元素，但我需要使用javascript創建由div包圍的動態input元素

像這樣，

<td>
    <div class="autocomplete">
    <input style="height: 30px !important; width:400px;" class="form-control 
     rightalign" id="productname0">
     </div>
</td>

Answer 1

你的問題不是很清楚。 嘗試類似的事情：

var i = document.createElement("INPUT");
i.type="text";
i.setAttribute("style","height: 30px !important; width:400px;");
i.className="form-control rightalign";
i.id="productname0";  

Array.prototype.slice.apply( document.getElementsByClassName("autocomplete")).map(function(div, j){
    div.appendChild(i.cloneNode(true));
});

Answer 2

這是基本的 DOM 操作：

 let td = document.querySelector('td'); let div = document.createElement('div'); let input = document.createElement('input'); div.classList.add('autocomplete'); input.classList.add('form-control'); input.classList.add('rightalign'); input.id = 'productname0'; input.style = 'height: 30px !important; width:400px;'; div.appendChild(input), td.appendChild(div);

 <table><tr><td></td></tr></table>