案例贪吃蛇，把封装的函数移动到js文件中

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>title</title>

  <style>

    .map {

      width: 800px;

      height: 600px;

      background-color: #CCC;

      position: relative;

    }

  </style>

</head>

<body>

  <!--画出地图,设置样式-->

  <div class="map"></div>

  <script src="food.js"></script>

  <script src="Snake.js"></script>

  <script src="Game.js"></script>

  <script>

    //初始化游戏对象

    var gm = new Game(document.querySelector(".map"));

    //初始化游戏---开始游戏

    gm.init();

  </script>

</body>

</html>

JS高级---案例贪吃蛇，把封装的函数移动到js文件中的更多相关文章

  1. js面向对象案例 贪吃蛇

    食物对象 (function () { //map:所在的父盒子,obj自身的一些属都具有默认值 function Food(map, obj) { obj = obj || {}; //没有则使用默 ...

  2. JS高级---案例：贪吃蛇小游戏

    案例:贪吃蛇小游戏 可以玩的小游戏,略复杂,过了2遍,先pass吧 先创建构造函数,再给原型添加方法.分别创建食物,小蛇和游戏对象. 食物,小蛇的横纵坐标,设置最大最小值,运动起来的函数,按上下左右键 ...

  3. 原生js写的贪吃蛇网页版游戏特效

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <bo ...

  4. 20行JS代码实现贪吃蛇

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 用js写一个贪吃蛇小游戏

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JS高级---案例：随机小方块 （贪吃蛇的食物部分）

    案例:随机小方块 产生随机数对象,自调用构造函数 产生小方块对象,自调用构造函数,里面存放: 食物的构造函数 给原型对象添加方法:初始化小方块的显示的效果及位置---显示地图上 给原型对象添加方法,产 ...

  7. 【 D3.js 高级系列 — 1.1 】 封装文本自动换行

    在[高级 - 第 1.0 章]中讲解了在 SVG 中如何配合使用 text 和 tspan 来实现换行的功能,本文对此功能进行一下封装,以后就可以直接用了. 1. 引用 js 文件 下载地址:mult ...

  8. JS高级---案例：验证表单

    案例:验证表单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  9. JS高级---案例：验证密码的强度

    案例:验证密码的强度 1. 给我密码,我返回对应的级别 2. 每次键盘抬起都要获取文本框中的内容, 验证文本框中有什么东西, 得到一个级别, 然后下面的div显示对应的颜色 <!DOCTYPE ...

随机推荐

  1. C# LINQ学习笔记四：LINQ to OBJECT之操作文件目录

    本笔记摘抄自:https://www.cnblogs.com/liqingwen/p/5816051.html,记录一下学习过程以备后续查用. 许多文件系统操作实质上是查询,因此非常适合使用LINQ方 ...

  2. 二叉堆（2）LeftistHeap

    左倾堆,用于堆的快速合并. 规则: ① 节点的键值小于或等于它的左右子节点的键值. ② 节点的左孩子的NPL >= 右孩子的NPL. ③ 节点的NPL = 它的右孩子的NPL + 1. 测试文件 ...

  3. 从servlet向jsp中传数据用Java接收js调用

    servlet: response.sendRedirect("showMessage.jsp?ValueA=1"); jsp: var a=<%=request.getPa ...

  4. JS使用知识点理解

    var keyValue = $.request("keyValue"); $(function () { ////修改页面select下拉选框js $("#BloodB ...

  5. pandas 读取excel时，遇到数字变为科学计数法了， 怎么破？？ 别慌 这样来处理

    # 指定字段以string 方式读取 df = pd.read_excel("./test.xlsx", converters={"id": str})

  6. python创建字典的三种方式

    创建空字典: dict_eq={} print(type(dict)) 直接赋值创建字典: dict_eq={'a':1,'b':2,'c':'adbc'} 通过关键字dict和关键字参数创建 dic ...

  7. HBuilderX开发app实现自动更新版本

      需求说明:使用MUI+Vue等技术并且通过HBuilderX打包开发移动app,在有版本更新时需要自动提示用户有新版本,并且可以点击下载自动安装. 思路说明: 应用打开时(使用Vue的生命周期mo ...

  8. 【Unity|C#】基础篇(10)——泛型（Generic）/ 泛型约束条件（where）

    [学习资料] <C#图解教程>(第17章):https://www.cnblogs.com/moonache/p/7687551.html 电子书下载:https://pan.baidu. ...

  9. Java注释&标识符

    注释: 单行注释:// 多行注释:/*   */ 文档注释:/**  */ 其中文档注释可以Export导出dox文档,常用Javadox标记如下: @author:指定Java程序的作者 @vers ...

  10. word中去除所有table键

    1.打开word---文件---选项---显示,不勾选制表符 2.选择需要的文本,按[CTRL+H]查找替换, 3.将鼠标定位至“查找内容”,点击“特殊格式-制表符”,然后出现^t,在“替换为”中输入 ...