JS的一些简单应用 —— 五子棋

最新推荐文章于 2023-07-08 20:01:35 发布

烟敛寒林o

最新推荐文章于 2023-07-08 20:01:35 发布

阅读量371

点赞数

分类专栏： ★ JavaScript

本文链接：https://blog.csdn.net/dyw_666666/article/details/80375613

版权

JS笔记及简单应用同时被 2 个专栏收录

26 篇文章 1 订阅

订阅专栏

★ JavaScript

20 篇文章 1 订阅

订阅专栏

让我们用JS来玩五子棋吧！（棋的颜色和背景色可以自己修改）
这里写图片描述

代码如下：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    <style>
        table {
            width: 400px;
            height: 400px;
            border: 0;
            border-collapse: collapse;
            background:yellow;
        }

        td {
            border: 1px solid gray;
        }

    </style>
    </head>
    <body>
        <h1>
            事件委托
        </h1>
            <table>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
            </table>
        <!-- table>tr*5>td*5 按tab !>-->
        <!-- form>p*3>input:text -->
    </body>
        <script>

        var num = 0;

        document.getElementsByTagName('table')[0].onclick = function(ev) {
            ev.target.style.background = num++%2 ? 'black' : 'white';
        }

/*
        var tds = document.getElementsByTagName('td');
        var i=0;
        while(i<tds.length) {
            tds[i].onclick = function() {
                this.style.background = 'black';
            }
            i++;
        }
*/
        </script>
</html>

烟敛寒林o

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
JS的一些简单应用 —— 五子棋

让我们用JS来玩五子棋吧！（棋的颜色和背景色可以自己修改）代码如下：&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;style&gt; table { width: 40
复制链接

扫一扫