javascript - 如何在JavaScript中动态填充表中获取td的innerHTML

Question

我创建了一个表并从数组中填充了值，因此我有 5x5 的表，其中每个 td 将填充一个单词。该单词来自数组 memo 并且下面的所有代码都可以正常工作。

var myTableDiv = document.getElementById("results")
var table = document.createElement('TABLE')
var tableBody = document.createElement('TBODY')

table.border = '1'
table.appendChild(tableBody);

//TABLE ROWS
for (i = 0; i < this.memo.length; i++) {
    var tr = document.createElement('TR');
    for (j = 0; j < this.memo[i].length; j++) {
        var td = document.createElement('TD');
        td.onclick = function () {
            check();
        }
        td.appendChild(document.createTextNode(this.memo[i][j]));
        tr.appendChild(td)
    }
    tableBody.appendChild(tr);
}  
myTableDiv.appendChild(table);

我有一个问题:我想单击单元格并获取属于该单元格的单词。 为此，我在创建 td 元素时尝试了 onclick 元素

   td.onclick = function () {
            check();
        }

函数检查应该打印被单击的单元格的innerHTML

function check() {
    var a = td.innerHTML;
    console.log(a);
}

但它总是给我错误的文本 - 数组中的最后一个已填充的文本。 我该如何解决它？...

Answer 1

您始终会获得数组中的最后一个 td，因为设置为 td 的最后一个值是最后一个单元格的值。您需要将一个参数(例如 event)添加到 onclick 的回调函数中，然后您的单击元素将在 event.target 中引用>。然后你就可以获得它的innerHTML。