首页 > 代码库 > javascript简单写出国际象棋棋盘
javascript简单写出国际象棋棋盘
关于昨天的一个作业,做了一个国际象棋的棋盘,效果图如下
这里的思路是根据off=true的值进行反转来判断单元格的颜色。
就那第一行来说,当条件语句if的off=true则输出str+=‘<td class="td01"></td>‘;,然后off=!off进行反转,得到off=false。在下一次循环条件语句if的off=false,则输出str+=‘<td class="td02"></td>‘;,然后off=!off再进行反转,如此反复。
当里面的for循环完毕,off=!off再进行反转。
代码如下:
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>国际象棋棋盘</title> <script type="text/javascript"> var str="<table cellpadding=‘0‘ cellspacing=‘0‘>"; var off=true; for(i=1;i<=8;i++){ str+="<tr>"; for(j=1;j<=8;j++){ if(off){ off=!off; str+=‘<td class="td01"></td>‘; } else{ off=!off; str+=‘<td class="td02"></td>‘; } } off=!off; str+="</tr>"; } str+="</table>"; document.write(str); </script> <style type="text/css"> table{ border: 1px solid #000; } td{ width: 100px; height: 100px; background: #ff0; } .td01{ background: #fff; } .td02{ background: #000; } </style> </head> <body> </body></html>
javascript简单写出国际象棋棋盘
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。