javascript - 使用循环更改单元格背景颜色？

Question

在循环中，我需要生成一个随机数并将其转换为随机颜色。然后，使用生成的颜色更改单元格的背景颜色。迭代 10 次并从最左边的单元格到最右边的单元格更改颜色。问题是我不知道该怎么做。以下是我生成我需要的表的代码。我不确定这是否可行，因为我如何在不使用 id 的情况下访问单个单元格？

<table>
<tr>
<script type="text/javascript">
var rownum = 1; var colnum = 1;
while (rownum <= 1){
document.write("<tr>");
while (colnum <= 10) {
document.write("<td>"+colnum+"</td>");
colnum++;
}
document.write("</tr>");
colnum = 1; rownum++;
}

Answer 1

这是一个适合您的工作示例。

JSFiddle example

var myColors = [];
for (var ii=0;ii<10;ii++){
myColors.push({value:getRandomColor()});
}

var myHtml = '<table><tr>';

for (var xx=0;xx<10;xx++){

var temp ='<td style="background-color:'+myColors[xx].value+'">Cell     '+xx+'</td>'

myHtml+=temp;
}

myHtml +='</tr><table>'

console.log(myHtml);

var myElement = document.getElementById('content');

myElement.innerHTML = myHtml;



//http://stackoverflow.com/questions/1484506/random-color-generator-in-javascript
function getRandomColor() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
    color += letters[Math.floor(Math.random() * 16)];
}
return color;
}

注意:我想说，使用内联样式是一件坏事。但是......在这种情况下，这是最短的解决方案。