简单的js网页应用（事件与事件处理的响应）

1.操作符之间的优先级（高到低）：算术操作符--比较操作符--逻辑运算符--赋值符号；如是同级则按从左到右来计算。

2.Object.prototype的值是null 也就是说Object构造函数的原型对象的原型对象是null；

3.数组：创建的数组是空数组，没有值，如要输出，则显示undefined;即使在创建数组时，定义了数组长度，但实际上数组长度都是会变化的，仍然可以将元素存储在规定长度以外。创建数组两个方法：var myarray = new Array();     字面量：var myarray = [a,s,c,d];

    数组存储的数据可以是任何类型（数字、字符、布尔值等）;数组任何时候都可以不断向数组增加新元素；length表示数组的长度，即数组中元素的个数。length属性也是可变的。在js中，也有二维数组，二维数组的两个维度的索引也是从0开始，两个维度的最后一个索引值为长度-1.

创建方法：

var myarr=new Array();  //先声明一维 

for(var i=0;i<3;i++){   //一维长度为3

   myarr[i]=new Array();  //再声明二维 

   for(var j=0;j<6;j++){   //二维长度为6

   myarr[i][j]=i*j;   // 赋值，每个数组元素的值为i*j

   }

 }

4.局部变量与全局变量的区别：在ES6之前，用var关键字定义在函数内部的变量，它的作用于在函数内部，函数执行完毕后，就会被销毁；全局变量是定义在函数外部的变量，它的作用域在当前文件，使用完毕后也不会立即销毁，要关闭浏览器之后，全局变量才被销毁。

来两个简单的例子

鼠标移动的效果：html代码：

<div id = "mydiv" onmouseenter="mEnter()" onmouseleave="mLeave()"></div>

css代码：#mydiv {width:400px; height:400px;border:1px solid black; transition:width 3s, height 3s}

javascript代码：

     var mdiv = document.getElementById("mydiv");  

     function mEnter(){

       mdiv.style.background = "orange";

       mdiv.style.width = 50+"px";

       mdiv.style.height = 50+"px";

}

  function mLeave(){

     mdiv.style.bacjground = "white";

     mdiv.style.width = 500+"px";

     mydiv.style.height = 500+"px";

}

事件与事件处理的响应（开关灯）

html代码：<div id = "mydiv">

<button onclik="handle()" id = "mybtn">

关

</button>

</div>

css代码：*{padding:0px;margin:0px;}

body,html{

widtn:100%;

height:100%

}

#mydiv{

width ;100%;

height:100%

background:white;

}

javascript代码:

  var div = document.getElementById("mydiv");

  var btn = document.getElementById("mybtn");

  var isOpen = true;

  function handle(){

  if(isOpen){

  btn.innerHTML = "开";

  div.style.background =  "black";

   isOpen = false;

}else{

  btn.innerHTML = "关";

  div.style.background = "white";

  isOPen = true;

         }

}