如何实现循环（Javascript)？
在HTML中使用Javascript的循环功能来生成一个表格，每个表格的背景色从#000000到#ffffff共有15×15×15×15×15×15=11390625(这...
在HTML中使用Javascript的循环功能来生成一个表格，每个表格的背景色从#000000到#ffffff共有15×15×15×15×15×15=11390625(这是所有颜色值的数目）种。即：循环变量的改变将是颜色值的依次改变。
有那位高手能消除我心中的疑惑？ 展开
有那位高手能消除我心中的疑惑？ 展开
展开全部
其实如果真要列出所有颜色，是没有意义的。原因：一、浏览器承受不了这个循环次数；二、肉眼很难分辨出某些相近颜色的区别。不过你这个题目用来作为初级编程习题是很不错的。以下是一个完整代码，另存为.htm文件即可浏览。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>表格背景颜色变化</title>
</head>
<script type="text/javascript">
window.onload = function(){
var tableStr = getTable(3000);
document.getElementById("container").innerHTML = tableStr;
document.getElementById("msg").value = tableStr;
}
/**
* 按行变幻表格背景颜色
* @param int n 要生成的表格行数
*/
function getTable(n){
var colors = [0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f'];
var strs = ["<table width='80%' border='1'>\n"];
var color = [0,0,0,0,0,0];
var cstr;
for(var i=0,index=0;i<n;++i){
if(!(i%16) && i!=0){
++index;
}
for(var j=0;j<=index%6;++j){
color[j] = colors[index%16];
}
color[Math.floor(index/6)%6] = colors[i%16];
cstr = color.join('');
strs.push("\t<tr>");
strs.push("<td style='background:#");
strs.push(cstr);
strs.push(";color:#ffffff'>#");
strs.push(cstr);
strs.push("</td></tr>\n");
}
strs.push("</table>");
return strs.join('');
}
</script>
<body>
<div id="container"></div>
<textarea id="msg" cols="80" rows="30"></textarea>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>表格背景颜色变化</title>
</head>
<script type="text/javascript">
window.onload = function(){
var tableStr = getTable(3000);
document.getElementById("container").innerHTML = tableStr;
document.getElementById("msg").value = tableStr;
}
/**
* 按行变幻表格背景颜色
* @param int n 要生成的表格行数
*/
function getTable(n){
var colors = [0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f'];
var strs = ["<table width='80%' border='1'>\n"];
var color = [0,0,0,0,0,0];
var cstr;
for(var i=0,index=0;i<n;++i){
if(!(i%16) && i!=0){
++index;
}
for(var j=0;j<=index%6;++j){
color[j] = colors[index%16];
}
color[Math.floor(index/6)%6] = colors[i%16];
cstr = color.join('');
strs.push("\t<tr>");
strs.push("<td style='background:#");
strs.push(cstr);
strs.push(";color:#ffffff'>#");
strs.push(cstr);
strs.push("</td></tr>\n");
}
strs.push("</table>");
return strs.join('');
}
</script>
<body>
<div id="container"></div>
<textarea id="msg" cols="80" rows="30"></textarea>
</body>
</html>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
