分析2048游戏代码

By admin, 1 十二月, 2016

这部分内容涉及HTML、JavaScript和CSS知识,不涉及后端PHP和MySQL知识。

https://github.com/hgneng/2048

1. 首页index.html

https://github.com/hgneng/2048/blob/master/index.html

2. 样式main.css

https://github.com/hgneng/2048/blob/master/style/main.css

3. JavaScript逻辑

JavaScript是按照HTML里引用的顺序执行的,所以阅读JavaScript逻辑时应该按照引用的顺序一个一个阅读:

 

  <script src="js/bind_polyfill.js"></script>
  <script src="js/classlist_polyfill.js"></script>
  <script src="js/animframe_polyfill.js"></script>
  <script src="js/keyboard_input_manager.js"></script>
  <script src="js/html_actuator.js"></script>
  <script src="js/grid.js"></script>
  <script src="js/tile.js"></script>
  <script src="js/local_storage_manager.js"></script>
  <script src="js/game_manager.js"></script>
  <script src="js/application.js"></script>

4. main.scss

SCSS是一种CSS的扩展语言,可以定义一些变量之类,这在针对不同屏幕尺寸定义不同样式时很有用,可以减少许多重复的代码。main.css是由main.scss生成的。

评论

Restricted HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id> <img src>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。
验证码
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.
请输入"Drupal10"