JavaScript

什么是JavaScript:

　　JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

1. 是一种解释性脚本语言（代码不进行预编）。 
   
2. 主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。
   
3. 可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。
   
4. 跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如Windows、Linux、Mac、Android、iOS等。

JS中的一些语法:

　　示例:

//获取哪个标签

var jsmainscreen = document.getElementById("mainscreen")
var jsbg1 = document.getElementById("bg1")
var jsbg2 = document.getElementById("bg2")

//间歇定时器

var timerbg = window.setInterval(function(){
jsbg1.style.top = jsbg1.offsetTop+1+"px";
jsbg2.style.top = jsbg2.offsetTop+1+"px";
if(jsbg1.offsetTop>760){
jsbg1.style.top = -768+"px";
}
if(jsbg2.offsetTop>760){
jsbg2.style.top = -768+"px";
}
},10)

//拖动飞机
var jsairplane =document.getElementById("airplane")

basex =0
basey =0
movex =0
movey =0
//添加事件，这个是鼠标按下花时间
jsairplane.addEventListener("mousedown",function(e){
var ev = e||window.event
basex =ev.pageX
basey =ev.pageY

jsmainscreen.onmousemove=function(e){
var ev1 = e||window.event
movex = ev1.pageX-basex
basex = ev1.pageX
movey = ev1.pageY-basey
basey = ev1.pageY
if(jsairplane.offsetLeft+movex>0 && jsairplane.offsetLeft+movex<342&&jsairplane.offsetTop+movey>0&&jsairplane.offsetTop+movey<651)
{
jsairplane.style.left =jsairplane.offsetLeft+movex+"px";
jsairplane.style.top = jsairplane.offsetTop+movey+"px";
}
}
document.addEventListener("mouseup",function(e){
jsmainscreen.onmousemove=null;
})
},false)

 

//子弹飞
//创建子弹标签
var count = 0
var timerbullen = setInterval(function(){

//DOC创建元素标签
var bullen =document.createElement("div")
jsmainscreen.append(bullen)
bullen.className ="bullent"
bullen.style.left = jsairplane.offsetLeft +85 +"px"
bullen.style.top = jsairplane.offsetTop -20 +"px"
count++
console.log("发射了多少发子弹"+count)
var timerbullenfly = setInterval(function(){
bullen.style.top =bullen.offsetTop -20 +"px";
console.log(bullen.offsetTop)
if(bullen.offsetTop <= -30){
clearInterval(timerbullenfly)
jsmainscreen.removeChild(bullen)
}
},50)
},100)

 

//键盘控制
document.onkeydown=function(e){
var evt = e||window.event
console.log(evt)
//移动
//上
var speed_w =10
var speed_H =10
var imgLeft=(jsairplane.offsetLeft)
var imgTop=(jsairplane.offsetTop)

switch(evt.keyCode){
case 37:
if(imgLeft>0){jsairplane.style.left=imgLeft-speed_w+"px";}
break;
case 38:
if(imgTop>0){jsairplane.style.top=imgTop-speed_w+"px";}
break;
case 39:
if(imgLeft<342){jsairplane.style.left=imgLeft+speed_w+"px";}
break;
case 40:
if(imgTop<651){jsairplane.style.top=imgTop+speed_w+"px";}
break;
}
}

JS主要是对标签的灵活调用，让标签动起来，我们学习JS首先要对HTML文本进行掌握，才能更好的找到标签，操作标签。

 

//DOM对象：有jQuery，这个数据JS的封装库。以更加简洁易懂的方式操作标签。