我正在尝试创建一个动态 js 表，我想动态地为每个单元格提供 id。我想使用这些 id 在不同的 js 事件处理程序中使用。怎么做到的？我尝试了不同的方法，但都没有用!
<html>
<head>
<style>
#colors {
float: right;
width: 400px;
height: 400px;
}
</style>
</head>
<body>
<script>
var d;
var k = 0;
function makeit() {
var tbl = document.createElement("table");
var atts = document.createAttribute("style");
atts.value = "border:1px solid black;text-align:center;padding:2px;margin:3px 3px 3px 3px;";
tbl.setAttributeNode(atts);
for (i = 0; i < 5; i++) {
var rows = tbl.insertRow(i);
for (j = 0; j < 7; j++) {
d = rows.insertCell(j);
d.height = "50px";
d.width = "50px";
d.style.backgroundColor = "yellow";
d.addEventListener("click", function myfunc() { d.style.backgroundColor = "red"; });
}
}
document.body.appendChild(tbl);
}
window.onload = makeit;
</script>
</body>
</html>
最佳答案
只需添加
d.id = "r" + i + "c" + j;
下
d=rows.insertCell(j);
为每个 td 设置唯一的 ID。
显然，您可以根据自己的喜好更改语法 r2c4(即 3.row 和 5.cell)。
如果你想在点击一个特定的td时调用一个函数，你甚至可以传递行索引(i)和列索引(j) 到那个函数。
旁注
您应该考虑使用像 jQuery 这样的 JavaScript 库或框架。对于这样的操作。从长远来看，这将极大地促进您的工作。
关于javascript - 将 id 动态添加到每个表格单元格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23003341/