Javascript DOM - 将单元格属性设置为图像？

Question

我有一个小困境。我正在动态尝试根据 SQL 响应将表格单元格 html 设置为图像。我下面的方法不起作用..

var data = document.createElement("td");

if  (response.getElementsByTagName('status')[i].childNodes[0].nodeValue=='unread') {

    data.setAttribute('id', 'emailunread');
    data.innerHTML="<img src ='/img/unread.png' width='64' height='64'>";
    else {

    data.setAttribute('id', 'emailread'); }
    data = '<img src="img/read.png>'; }

有什么想法我可能做错了吗？

Answer 1

您需要使用右花括号关闭您的 if 语句块。

if (response.getElementsByTagName('status')[i].childNodes[0].nodeValue=='unread') {

    data.setAttribute('id', 'emailunread');
    data.innerHTML="<img src ='/img/unread.png' width='64' height='64'>";
} else {

    data.setAttribute('id', 'emailread');
    data = '<img src="img/read.png>'; 
}

此外，正如 Bergi 所指出的，您正在用 else 子句中的一些 HTML 覆盖包含您的 DOM 元素的变量。

Answer 2

您忘记在最后一行使用innerHTML property。而不是用字符串覆盖变量：

data = '<img src="img/read.png>';

你想要的

data.innerHTML = '<img src="img/read.png>';

另外，您的区块似乎没有正确关闭，倒数第二行还有一个额外的}。不确定这些只是 c&p 错误还是您的实际问题。

顺便说一句，您应该将 response.getElementsByTagName('status') 的值分配给一个变量并循环遍历该变量（我假设 i 是一个迭代变量），而不是每次都查询 DOM。