Javascript 将数据插入 HTML 表格

标签 javascript html

这是一个相当简单的问题,我在将数据从 Javascript 插入 HTML 表格时遇到了问题。

这是我的 JavaScript 的摘录:

已更新 - 我摆脱了两个循环并将其简化为一个循环,但是仍然存在问题..

    for (index = 0; index < enteredStrings.length; index++) {
        output.innerHTML += "<td>" + enteredStrings[index] + "</td>"
        + "<td>" + enteredStringsTwo[index] + "</td>";
        nameCounter++;
        total.innerHTML = "Total: " + nameCounter;
    }

这是我的 HTML 页面的一个异常(exception):

<table id="nameTable">
   <tr>
     <th>First</th><th>Last</th>
   </tr>

更新图片:

alt text

最佳答案

试试这个(已编辑):

var tableContent = '<tr>';
for (index = 0; index < enteredStrings.length; index++) {
    tableContent += "<td>" + enteredStrings[index] + "</td>";
    nameCounter++;  // I don't know if this should be there, 
                    // logically the counter should be incremented here as well?
    total.innerHTML = "Total: " + nameCounter;
}
tableContent += '</tr><tr>';

for (index = 0; index < enteredStringsTwo.length; index++) {
    tableContent += "<td>" + enteredStringsTwo[index] + "</td>";
    nameCounter++;
    total.innerHTML = "Total: " + nameCounter;
}
tableContent += '</tr>';
output.innerHTML += tableContent;

Edit2(更新问题代码):

var tableContent = '<tr>';
for (index = 0; index < enteredStrings.length; index++) {
    tableContent += "<td>" + enteredStrings[index] + "</td>"
    + "<td>" + enteredStringsTwo[index] + "</td>";
    nameCounter++;
    total.innerHTML = "Total: " + nameCounter;
}
tableContent += '</tr>';
output.innerHTML += tableContent;

Edit3(查看电子邮件中发送的代码后):

var tableContent = "";

for (index = 0; index < enteredStrings.length; index++) {
    tableContent += "<tr><td>" + enteredStrings[index] + "</td>"

    + "<td>" + enteredStringsTwo[index] + "</td></tr>";

    nameCounter++;
    total.innerHTML = "Total: " + nameCounter;
}
output.innerHTML = tableContent;

关于Javascript 将数据插入 HTML 表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4457607/

相关文章:

Javascript 对象字面量、POST 问题

javascript - 具有绝对路径的 anchor 链接的平滑移动

javascript - 在 URL 查询字符串中指定样式

html - 垂直对齐文本与图标

javascript - 从智能手机和平板电脑识别用户并隐藏元素

javascript - $.ajax - 发送数据属性对象

javascript - 如何使用 javascript 或 angular2 读取浏览器错误?

html - 段落延续效果,比如末尾三个点之类的

javascript - 如何在不指定高度的情况下仅向一个div添加垂直滚动条?

html - 如何用css画一条线并在上面显示文字或图片