无法为表中循环创建的单元格获取ElementById。

Question

我不能通过javascript代码给我的td元素着色。控制台说

Uncaught TypeError: Cannot read property 'style' of undefined
    at index.html:96

我已经在基本面板上测试过了。

<div id = "panel"></div>

let panel = document.getElementById('panel');
this.panel.style.backgroundColor = `rgba(${color[0]},${color[1]},${color[2]},${color[3]})`;

它工作得很好... 面板已经按照我的要求改变了颜色。

下面是不能工作的代码。

for (var i = 1; i <= 8; i++) {
    document.write("<tr>");
    for (var k = 1; k <= 8; k++) {
    document.write("<td id = ",i,k,">" + "#" + "</td>");
    }
document.write("</tr>");
}   


let cell = document.getElementById('41');


this.cell.style.color = `rgba(${color[0]},${color[1]},${color[2]},${color[3]})`;

在浏览器的开发工具中，单元格已经有41号。

缺少了一些代码，但必要的代码在这里。(元素被colorpicker着色。)是否有一个通过for循环生成id的问题？如何解决？

谢谢你的回答。

Answer 1

你的第一个问题是你定义了一个叫做 cell 但正试图访问一个 财产 叫做 cell 无论 this 是。

摆脱 this.

如果你在全球范围内 和 你用过 var 而不是 let那么你将创建一个 window.cell 以致于 this.cell 会在那里工作......但你使用的是 let 所以事实并非如此）。)

---

你的第二个问题是 document.write 将会被缓冲，这样它就可以被插入到DOM中，然后在 </script> 为当前脚本元素。这不会发生，直到脚本完成执行。

你正在使用 getElementById 过早. HTML还在缓冲区里，还没有被转换为DOM。

---

这也是避免使用 document.write. 使用DOM方法，如 createElement 和 appendChild 来代替。

作为奖励，这将给你一个元素的引用，所以你不需要在DOM中用 getElementById.