Javascript 执行代码TypeError后出错：display为nullscript.js:22:22

HTML 这是一个HTML页面，当用户单击“添加”按钮时，我在表格中一行一行地添加到另一行的下方，并给出如下错误

<div id="adder">
    <table id="adderhd">
        <tr>
            <th>PARTICULARS</th>
            <th>Amount</th>
        </tr>
        <tr>
            <th><input type="text" id="particulars" value=""></th>
            <th><input type="number" id="amount" value=""><button id="add">Add</button></th>
        </tr>
    </table>
</div>

<div id="tables">
    <div>
        <table class="table-1">
            <tr>
                <th>
                    PARTICULARS
                </th>
                <th>
                    AMOUNT
                </th>
            </tr>
        </table>
    </div>
</div>    

---

您需要在单击按钮时添加一个事件来调用rowAdder函数。变量“display”按id获取元素，因此将id=“table-1”分配给html元素。工作正常

函数行加法器（）{
var详情=document.getElementById（“详情”）.value；
var金额=document.getElementById（“金额”）.value；
如果（！详情| |！金额）{
警报（“请在所有字段中输入值。”）；
返回；
}
var display=document.getElementById（“表1”）；
var newRow=display.insertRow（）；
var cel1=newRow.insertCell（0）；
var cel2=newRow.insertCell（1）；
cel1.innerHTML=详细信息；
cel2.innerHTML=金额；
}

详情
数量
添加
详情
数量

您需要js代码吗？您得到的错误是什么？当我按下“添加”按钮时，我得到的错误如下。TypeError:display是nullscript.js:22:22行加法器和js/Web 1/js/script.js:22和js/Web 1/js/script.js:8 jQuery 2no@sonEtLumiere，我的意思是“insertRow（row）”在我的代码中不起作用。非常感谢@andydavies现在它工作正常，这是一个愚蠢的错误。谢谢@sonEtLumiere，实际上我使用了jQuery click事件。但是，我们也可以通过您所描述的方法来完成任务。

function rowAdder() {
    var particulars = document.getElementById("particulars").value;
    var amount = document.getElementById("amount").value;

    if (!particulars || !amount) {
        alert("Please enter the values inside all the field.");
        return;
    }

    var display = document.getElementById("table-1");    
    var newRow = display.insertRow(row);      //not working (insert(row)); 
    var cel1 = newRow.insertCell(0);
    var cel2 = newRow.insertCell(1);

    cel1.innerHTML = particulars;
    cel2.innerHTML = amount;    
    row++;

}