美文网首页丹青远楼阁周文佳语强化班
《JavaScript拳皇》先就这样吧

《JavaScript拳皇》先就这样吧

作者: 王跃坤txdy | 来源:发表于2019-08-17 16:47 被阅读13次

这周在leetcode练了几道题,easy难度的做起来都有些吃力,是时候捡起来了。。。

拳皇

js写了一个游戏,

只有两个人物,

不可以选人物,

碰撞检测用的矩形碰撞,

人物只能左右跳跃蹲下加攻击

图片是直接从网上找的,血条蓝条用的div,

动作用的gif+定时器

emm一个非常low版的拳皇就这样了

一直觉得做网页是一个一直在做重复事情的事,

所以开始就想写个啥游戏,

开始java阶段写的逻辑游戏,所以先排除掉了逻辑游戏

后来偶然机会想做下拳皇,然后就做个low版的

后来觉得自己的网页结构也不是很熟练,

想做网页来着,又想想,后边jquery也是要写网页的

所以js先就这样吧!

总结点知识点:

js基础语法和java是差不太多的,就是一门弱类型的脚本语言

js常用的事件:

单击事件onclick 

双击事件ondblclick

按下鼠标onmousedown

松开鼠标onmouseup 

把鼠标放到上面onmouseover 

移动鼠标ommousemove

移开鼠标onmouseout 

按下键盘onkeydown

松开键盘onkeyup 

按住键盘onkepress 

失去焦点onblur

得到焦点onfocus 

页面加载事件onload

值改变事件onchange

BOM操作

框体方法

alert(警告框);没有返回值

confirm(确认框);有两个返回值

prompt(输入框);提示用户信息的录入

定时和间隔执行方法

setTimeout(function(){},1500);定时执行

clearTimeout(id);清除定时执行

setInterval(function(){},2000);间隔执行

clearInterval(id);

子页面方法

open(内含各种属性);

close(关闭open页面);

子页面调用父页面的函数

opener.父页面的函数

window对象的常用属性

地址栏属性:

location.href:“地址栏跳转的新地址”

location.reload();从新加载页面

历史记录属性

history.forward();页面资源(历史纪录)前进

history.back();页面资源(历史纪录)后退

history.go(index);跳转到指定的历史记录资源

屏幕属性

screen.width;获取屏幕宽度的分辨率

screen.height;获取屏幕高度的分辨率

浏览器配置属性

navigator.userAgent

主体面板属性(document)

DOM操作

document.getElementById('id属性值');返回拥有指定id的第一个对象的引用

document/element.getElementsByClassName('class属性值');返回拥有指定class的对象集合

document/element.getElementsByTagName('标签名');返回拥有指定标签名的对象集合

document.getElementsByName('name属性值');返回拥有指定名称的对象结合

document/element.querySelector('CSS选择器');仅返回第一个匹配的元素

document/element.querySelectorAll('CSS选择器');返回所有匹配的元素

document.documentElement获取页面中的HTML标签

document.body获取页面中的BODY标签

document.all['']获取页面中的所有元素节点的对象集合型

document.createElement('元素名');创建新的元素节点

document.createAttribute('属性名');创建新的属性节点

document.createTextNode('文本内容');创建新的文本节点

document.createComment('注释节点');创建新的注释节点

document.createDocumentFragment( );创建文档片段节点

parent.appendChild( element/txt/comment/fragment );向父节点的最后一个子节点后追加新节点

parent.insertBefore( newChild, existingChild );向父节点的某个特定子节点之前插入新节点

element.setAttributeNode( attributeName );给元素增加属性节点

element.setAttribute( attributeName, attributeValue );给元素增加指定属性,并设定属性值

parentNode.removeChild( existingChild );删除已有的子节点,返回值为删除节点

element.removeAttribute('属性名');删除具有指定属性名称的属性,无返回值

element.removeAttributeNode( attrNode );删除指定属性,返回值为删除的属性 

parentNode.replaceChild( newChild, existingChild );用新节点替换父节点中已有的子节点

element.setAttributeNode( attributeName );若原元素已有该节点,此操作能达到修改该属性值的目的

element.setAttribute( attributeName, attributeValue );若原元素已有该节点,此操作能达到修改该属性值的目的

闭包

js的每个函数都是一个个封闭空间,它可以获取外界信息,但是外界却无法直接看到里面的内容。将变量 n 放进小黑屋里,除了返回函数之外,没有其他办法能接触到变量 n,而且在函数 a 外定义同名的变量 n 也是互不影响的,这就是所谓的增强“封装性”。

作用域

由高层区域直接作用于低层区域,闭包可以影响变量作用范围

相关文章

网友评论

    本文标题:《JavaScript拳皇》先就这样吧

    本文链接:https://www.haomeiwen.com/subject/fvhksctx.html