javascript - 如何使用 Javascript 将文本框和按钮添加到表格中？

Question

抱歉，我是 Javascript 新手，这是我制作的第一个网站。我想知道为什么我的代码无法正常工作。

在应该显示的单元格中，显示的是 [object HTMLInputElement] 和 [object HTMLButtonElement]，而不是显示文本框和按钮。

function frenchBread(x){
      var table = document.getElementById("orderTable");
      var row = table.insertRow(0);

      var rem = document.createElement("button");
      var name = document.createTextNode("Remove");
      rem.appendChild(name);  

      var num = document.createElement("input");

        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        var cell3 = row.insertCell(2);

        cell1.innerHTML = "French Bread";
        cell2.innerHTML = document.body.appendChild(num);
        cell3.innerHTML = document.body.appendChild(rem);
        x.disabled = true;

  }


<button type = "button" class = "itemClick" onclick  = "frenchBread(this);">French Bread</button>

<table id = "orderTable">
</table>

Answer 1

只需附加变量，无需调用innerHTML:

cell1.innerHTML = "French Bread";
cell2.appendChild(num);
cell3.appendChild(rem);

而不是:

cell1.innerHTML = "French Bread";
cell2.innerHTML = document.body.appendChild(num);
cell3.innerHTML = document.body.appendChild(rem);

FIDDLE