Javascript 中的 innerHTML 问题

Question

我的代码中的内部 HTML 有问题。似乎无法识别 HTML 标签并仅打印数据。

这是行

document.querySelector('#listreceipts').innerHTML = '<tr><td>' + grower + '</td><td>' + receipt + '</td><td>' + amnt + '</td><td>' + pdate + '</td></tr>';

我可能遗漏了什么？

Answer 1

如果 #listreceipts 是 <table>、<thead>、<tbody> 或 <tfoot> 它应该有效：

var grower = 1;
var receipt = 2;
var amnt = 3;
var pdate = 4;

document.querySelector('#listreceipts').innerHTML += '<tr><td>' + grower + '</td><td>' + receipt + '</td><td>' + amnt + '</td><td>' + pdate + '</td></tr>';

table, th, td {
    border: 1px solid black;
}

<table id="listreceipts">

</table>

因此您需要添加 += 而不是 =。如果 innnedHTML 代码被浏览器解析得很好，它将工作；

Javascript 中的 innerHTML 问题

Problems with innerHTML in Javascript

html

javascript

innerhtml