首頁 > web前端 > js教程 > JavaScript強化教程 - 六步驟實現貪食蛇

JavaScript強化教程 - 六步驟實現貪食蛇

黄舟
發布: 2017-01-21 16:17:10
原創
1036 人瀏覽過

JavaScript強化教學 - 六步驟實作貪食蛇

1.首先建立div 並且給div加樣式

<div id="pannel" style="width: 500px;height: 500px;z-index: 1;opacity: 0.5"></div>
登入後複製

地圖(div和表格)、所有的塊(蛇頭,食物身體加樣式)

2.建立地圖

document.write("<table cellspacing=&#39;0px&#39;>");
    for (var i = 0; i < 10; i++) {... }
    document.write("</table>");
登入後複製

3.呼叫createNode函數建立區塊

var pannel = document.getElementById("pannel");
    function createNode(type) {... } //根据type创建块(0头部 1食物 2身体)    //申请一些变量以便以后调用
    var allNode = new Array();//存所有吃到的身体
    var fooldNode = null;//指向食物a
    var headNode = null;//指向头部b
    headNode = createNode(0);//创建头部A
    headNode.value = 39;//给头部一个方向  37左 38上 39右 40下
    fooldNode = createNode(1);//创建食物B
登入後複製
rr4.定時器在第4中的function moveNode() {...}; 定時執行此函數實現了:1.移動所有身體2.移動蛇頭

3.創建新塊並且新塊在蛇尾產生,方向與蛇尾相同

------------------------------------------------- -----------------------------------------------

實作源碼

function moveNode() {...};
登入後複製

以上就是JavaScript強化教程- 六步驟實現貪食蛇的內容,更多相關內容請關注PHP中文網(www.php.cn)!



相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板