Javascript 试图用JS更新段落元素，但它创建了一个新页面

我有一个收集数据并将其放入数组的表单

因此，我试图创建一个页面，一旦按下按钮，它就会运行这个函数，我希望它显示在表单下面的一个段落中，我已经给它分配了一个ID，以便可以添加更多的数据

但是，当我运行该页面时，它会在新页面中显示该表，并删除该表单。关于如何让它显示在表单下面的表格，有什么想法吗

这是电话

document.getElementById("appTable").innerHTML = showAppointments(appointmentArr);

这里是函数

function showAppointments(appointmentArr){ //Function to display all data in a table
        var splitAppointment = new Array();         
        for(var i=0; i <= appointmentArr.length; i++){
            if(i==0){ //Draw intitial table only once
                document.writeln('<table border="1">');
                document.writeln("<tr>");
                document.writeln("<th>Priority</th>");
                document.writeln("<th>Date</th>");
                document.writeln("<th>Start</th>");
                document.writeln("<th>End</th>");
                document.writeln("<th>Subject</th>");
                document.writeln("<th>Venue</th>");
                document.writeln("</tr>");
            }else{
                splitAppointment = appointmentArr[i-1].split(';'); //Split the main array by ";" into a seperate array to be read at current index
                document.writeln("<tr>");
                for(var j=0; j < splitAppointment.length; j++){ //Display each row of data in the table for single appointment details 
                    document.writeln("<td>"+splitAppointment[j]+"</td>");
                }
            document.writeln("</tr>");  
            }
        }
        document.writeln("</table>");
    }       

函数showAppointment（appointmentArr）{//函数以显示表中的所有数据
var splitAppointment=新数组（）；
对于（var i=0；i而不是使用document.writeln，您需要创建元素并将它们添加到DOM中，如下所示：

var table = document.createElement("table");
table.setAttribute("border","1");
document.body.appendChild(table);
var tr = document.createElement("tr");
table.appendChild(tr);
var th = document.createElement("th");
tr.appendChild(th);

我用另一种方法修复了它

我将所有信息写入一个变量，然后使用innerHTML输出该变量，它在同一页面上正确地写入了表的所有数据

例如

表+=“”

依此类推
我是将其放入函数还是html中？