Javascript 如何使用表单中的数据使用js生成表？

这个程序的目标是让我输入一些发票，按下一个按钮，然后用我输入的值添加一个新行。我正在使用一个外部JS文件来添加新行。代码是要遵循的

函数myFunction{ var Product1=oForm.elements[Product].value； var Description1=oForm.elements[Description].value； var UnitCost1=oForm.elements[UnitCost].value； var Units1=oForm.elements[Units].value； var Total1=单位成本1*单位1； var table=document.getElementByIdinvoiceTable； 变量行=table.insertRow1； var cell1=row.insertCell0； var cell2=row.insertCell1； var cell3=row.insertCell2； var cell4=row.insertCell3； var cell5=row.insertCell4； cell1.innerHTML=Product1； cell2.innerHTML=Description1； cell3.innerHTML=UnitCost1； cell4.innerHTML=Units1； cell5.innerHTML=Total1； } 人头{ 高度：100px； 宽度：1000px； 边框样式：实心； 边框宽度：1px； } 桌子{ 最小高度：300px； 宽度：1000px； 边框样式：实心； 边框宽度：1px； } 页脚{ 高度：浮动； 宽度：1000px； 边框样式：实心； 边框宽度：1px； } p{ 字体大小：25px； 字体大小：粗体； } 桌子{ 边界塌陷：塌陷； 宽度：90% } th， 运输署{ 边框样式：实心； 边框宽度：1px； } 发票生成器

产品 描述 单位成本 单位 全部的 产品： 说明： 单位成本： 单位：

---

希望这有帮助。首先引入JQuery，因为您说过可以使用它

<form>
        Product:
        <br>
        <input type="text" name="Product">
        <br>Description:
        <br>
        <input type="text" name="Description">
        <br>Unit Cost:
        <br>
        <input type="text" name="UnitCost">
        <br>Units:
        <br>
        <input type="text" name="Units">
        <br>
        <br>

        <input type="button" value="Submit" onclick="invoice()">
      </form><form>
        Product:
        <br>
        <input type="text" name="Product" id="Product">
        <br>Description:
        <br>
        <input type="text" name="Description" id="Description">
        <br>Unit Cost:
        <br>
        <input type="text" name="UnitCost" id="UnitCost">
        <br>Units:
        <br>
        <input type="text" name="Units" id="Units">
        <br>
        <br>

        <input type="button" value="Submit" onclick="invoice()">
  </form>

---JS---

var products = $('#Product').val();
var description = $('#Description').val();
var unitCost = $('#UnitCost').val();
var units = $('Units").val();

$('#invoiceTable tr:last').after('<tr>' + 
    '<td>' + products + '</td>'  +
    '<td>' + description + '</td>'
    '<td>' + unitCost + '</td>'
    '<td>' + units + '</td>'
    '</tr>');

---

我认为这应该行得通。请注意，我在输入标记中添加了id=field

您反对使用JQuery吗？我对它不太熟悉。。但是如果更容易。。我总是低头接受它。虽然我仍然想学习如何使用JS实现这一点。希望我的回答能有所帮助：-你能让它工作吗？