js随机让小方格变亮

最新推荐文章于 2023-06-27 16:54:27 发布

MuBeiBei

最新推荐文章于 2023-06-27 16:54:27 发布

阅读量1.2k

点赞数 1

分类专栏： Demo 文章标签： timer xhtml table border function html

本文链接：https://blog.csdn.net/MuBeiBei/article/details/6660718

版权

Demo 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

今天帮人解答问题时做的~·留作纪念吧~·

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*{margin:0; padding:0;}
table{width:400px;}
table td{height:35px; border:1px solid #000;}
</style>
</head>

<body>
<table>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</table>
<script>
    var tds = document.getElementsByTagName('td'),
    len = tds.length,num = 0,
    timer = setInterval(function(){
        var count = parseInt(9*Math.random());
        if(tds[count].style.background){
            for(var i = 0; i < len; i++){
                if(tds[i].style.background){
                    num++;    
                }    
            }
            if(num == 9){
                clearInterval(timer);    
            }else{
                num = 0;
                arguments.callee();    
            }
        }else{
            if(!tds[count].style.background){
                tds[count].style.background = '#333';    
            }
        }
    },1000);
</script>
</body>
</html>

MuBeiBei

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
js随机让小方格变亮

今天帮人解答问题时做的~·留作纪念吧~· 无标题文档*{margin:0; padding:0;}table{width:400px;}table td{height:35px; border:1px solid #000;}
复制链接

扫一扫