0

我正在用javascript动态创建一个表。另外我正在使用一些 CSS 代码来格式化表格。但是，我的代码没有采用任何格式。即使是最简单的，比如在桌子周围添加边框也不行。这是我的代码：

function parseRequest_ls(response) {
    document.getElementById("files").innerHTML += "<table border='2'>";

    for(var i=0;i<5;i++){
        if(response.data[i].type == "folder" || response.data[i].type == "album") {
            document.getElementById("files").innerHTML += "<tr><td><b>+</b> <a href='#'>"+ response.data[i].name + "</a></td></tr>";
        }
    }
    document.getElementById("files").innerHTML += "</ul></table></div>";
}

CSS 代码：

table, th, td {
    border: 2px solid;
    border-collapse: collapse;
    font-family: "Trebuchet MS", Arial, sans-serif;
    color: #555;
}

caption {
    font-size: 150%;
    font-weight: bold;
    margin: 5px;
}

td, th {
    padding: 4px;
}
4

3 回答 3

2

在你的功能中，你有

document.getElementById("files").innerHTML += "<table border='2'>"; // first line

和

document.getElementById("files").innerHTML += "</ul></table></div>"; // last line

您在最后一行放置了一个结束 ul 标记</ul>和一个结束 div 标记，但两者都</div>没有使用任何开头，因此损坏了，我认为您不应该在 a 内使用 a而不将其包装在 a 内。所以在这种情况下你可以使用taguldivHTMLultabletd

function parseRequest_ls(response) {
    var trs='';    
    for(var i=0;i<5;i++){
        if(response.data[i].type == "folder" || response.data[i].type == "album") {
            trs +="<tr><td><b>+</b> <a href='#'>"+ response.data[i].name + "</a></td></tr>";
        }
    }
    document.getElementById("files").innerHTML += "<table border='2'>"+trs+"</table>";
}

一个简单的例子。

于 2012-08-05T20:21:25.040 回答
1

不要+=与innerHTML. 首先在一个临时变量中构建一个字符串，然后一旦你的字符串中有一些完整的（有效的）HTML，你就可以使用+=它来将它附加到一个元素上。

于 2012-08-05T20:24:39.793 回答
-1

所以问题是，我无法通过 innerHTML 创建表格。我必须使用 DOM 对象来完成。我创建了一个 DOM 对象，然后使用 createElement 来获取表。有点不直接..但它有效..感谢大家的建议。:)

于 2012-08-06T04:09:53.533 回答