网页版2048-原型、原型链的应用

最新推荐文章于 2023-02-27 16:37:10 发布

muyphycx

最新推荐文章于 2023-02-27 16:37:10 发布

阅读量568

点赞数

文章标签： html 前端

本文链接：https://blog.csdn.net/muyphycx/article/details/55529505

版权

本文介绍了如何使用HTML、CSS和JavaScript实现一个网页版的2048游戏，通过实例展示了这三种技术在前端开发中的应用。

摘要由CSDN通过智能技术生成

写了一个网页版本的2048。感兴趣的同学可以看一看。

HTML：

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <link rel="stylesheet" href="2048.css"> 
    </head>
    <body>
        <!-- p>span#top+span#score -->
        <p>
            TOP:<span id="top">0</span><br>
            SCORE:<span id="score">0</span>
        </p>
    <!-- div#playground>div.grid*16+div#c.cell*16 -->
        <div id="playground">
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div class="grid"></div>
            <div id="c00" class="cell"></div>
            <div id="c01" class="cell"></div>
            <div id="c02" class="cell"></div>
            <div id="c03" class="cell"></div>

            <div id="c10" class="cell"></div>
            <div id="c11" class="cell"></div>
            <div id="c12" class="cell"></div>
            <div id="c13" class="cell"></div>

            <div id="c20" class="cell"></div>
            <div id="c21" class="cell"></div>
            <div id="c22" class="cell"></div>
            <div id="c23" class="cell"></div>

            <div id="c30" class="cell"></div>
            <div id="c31" class="cell"></div>
            <div id="c32" class="cell"></div>
            <div id="c33" class="cell">