如何在迭代创建HTML表时动态设置<TD>的id，从而获得ID值onBlur动作？
在迭代创建HTML表时，可以使用JavaScript来动态设置<td>元素的id，并且在onBlur动作中获取id值。以下是一个示例的解决方案：
<!DOCTYPE html>
<html>
<head>
<title>动态设置<td>的id并获取ID值</title>
<script>
function createTable() {
var table = document.createElement('table');
var tbody = document.createElement('tbody');
// 迭代创建表格行
for (var i = 0; i < 3; i++) {
var tr = document.createElement('tr');
// 迭代创建表格单元格
for (var j = 0; j < 3; j++) {
var td = document.createElement('td');
var cellId = 'cell-' + i + '-' + j; // 动态生成单元格id
td.setAttribute('id', cellId); // 设置单元格id
td.setAttribute('onBlur', 'handleBlur(this.id)'); // 设置onBlur动作
td.innerHTML = cellId; // 为了显示id，这里直接将id作为单元格内容
tr.appendChild(td); // 将单元格添加到行中
}
tbody.appendChild(tr); // 将行添加到表格体中
}
table.appendChild(tbody); // 将表格体添加到表格中
document.body.appendChild(table); // 将表格添加到文档中
}
function handleBlur(cellId) {
// 获取到了id值，可以在这里进行后续的操作
console.log('Blur event triggered for cell with id:', cellId);
}
</script>
</head>
<body onload="createTable()">
</body>
</html>上述示例使用JavaScript动态创建一个3x3的表格，并且为每个单元格设置了唯一的id。同时，使用onBlur事件处理程序来捕获单元格失去焦点的事件，并获取相应单元格的id值。
该示例中的createTable()函数用于创建表格，handleBlur()函数用于处理onBlur事件。你可以根据需要自定义这两个函数中的逻辑来实现你的具体业务需求。
请注意，示例中的代码只是一个简单的演示，你可以根据自己的实际需求进行扩展和修改。另外，对于每个问题中提到的知识点和名词，你可以自行进行扩展和补充。
相关·内容
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
云直播
对象存储活动推荐
腾讯云开发者
