客户端笔记四

JS:客户端脚本语音

 

引用类型：

原生对象：1. Obejct： js中所有类的父类

2.正则表达式

  VARrex=/^[A-Z]$/;  以/^开始  以 $/结束

3.包装类

 

 

 

 

失去焦点事件：

Onblur

 

以上 2016 6 21

 

Onsubmit 表单提交事件

 

Onsubmit=“return false”；则阻止表单提交

 

 

Onsubmit = “return checkForm()”; 如果里面有多个布尔值要进行运算 只能用这种方式

function checkForm(){

           var isName = checkName();

           var isTel = checkTel();

           var isGrade = checkGrade();

           var isEmail = checkEmail();

           return isName&&isTel&&isEmail&&isGrade;

       }

 

不能把&& 变为& 来实现，否则虽然会显示提示，但是依旧会提交

 

//用三目运算来实现，因为位运算返回的是 1 和 0 来表示true和false

       function test(){

           return(checkEmail()&checkGrade()&checkName()&checkTel())==1?true:false;

       }

 

 

 

原生对象：数组

Var arr = new Array(); 

Arr[0]=1;

Arr[10]=10; 那么没赋值的值是undefined。但是长度是11（0-10）。

数组长度是可以变化，可以给任何元素赋值，没赋值的元素都是undefined，

创建带初始值的数组

var x =[5,6,3,2,1];

追加元素

x.push(“abc”);

以*号连接元素

x.push(“*”);  ： 5*6*3*2*1*abc

 

 

 

 

原生对象： Date

//创建日期类型

       var date = new Date();

       //年份要加个1900 月份要加一个1

       alert((date.getYear()+1900)+"  "+(date.getMonth()+1)+"  "+date.getDate());

 

 

var spanObj;

       window.onload = function(){

           spanObj=document.getElementById("timeSpan");

           //让setTime方法每1000毫秒调用一次, 注意方法不要带括号

           window.setInterval(setTime,1000);

       }

 

       function setTime(){

           var mydate = new Date();

           spanObj.innerHTML = (mydate.getYear()+1900)+"年"+(mydate.getMonth())+"月"+mydate.getDate()+"日"

                                    +mydate.getHours()+":"+mydate.getMinutes()+":"+mydate.getSeconds();

       }

 

 

内置对象： globel

//判断一个字符串包含的内容是否是非数字。非数字返回true，数字返回false

isNaN();  isNaN(“12”)  :  false  isNaN(“abc”)  :  false  

 

//判断一个数字是否有界限 如果有界，返回true  如果没界 返回false

isInfinity();   isInfinity(5); : true   isInfinity(5/0); ：false

 

parseInt() parseFloat() 转化为整形或小数

//浏览器里面是默认用IOS8859-1传输数据，不支持中文，需要把中文转换,

encodeURI(); //转换特殊字符

encodeURI(‘abc中国 ’);

//里面的字符串当作表达式来执行

eval()

eval(“alert(‘abc’)”);

 

eval（“3+4+4”） ：11

 

instanceof 判断一个元素属于什么类型

 

js对象的特点：

1.      Javascript 是基于对象的面向对象语言。只有对象的概念，没有类，没有接口。

2.      Javascript 的函数本身也是对象。

3.      Javascript 对象的属性和方法，可以在运行期间动态的添加或删除

4.      //得到对象属性的方式：

        //1.通过对象点的方式  obj.name 2 是对象中括号 obj["name"]

        //遍历对象的属性和方法

        for(varfieldName in obj){

           alert(fieldName+ " " +obj[fieldName]); //得到的值 是属性名 + 属性值 全部遍历完，包括方法

       }

 

 

事件流：            

事件冒泡：先响应事件源，在响应父容器

事件捕获（NetsCape）先响应父容器，在响应事件源

事件处理（firefox）:可以选择先响应事件源还是先响应父容器

 

事件指派的方式有两种：

1.      传统事件添加特点：

A.     兼容性好，几乎浏览器都支持

B.     一个元素的一个事件只能绑定一个函数。（只会响应最后一次绑定的函数）

2.      现代事件添加特点：

A． 兼容性差，浏览器不同，添加事件的方式就不同

B． 一个元素的一个事件，可以绑定多个函数

 

传统事件添加，一个事件只能绑定一个函数，当给一个事件指明多个函数时，后面添加的函数会覆盖前面添加的函数

 

在绑定事件时，如果需要调用指定的函数，那么后面不能加括号。如果加上括号，表示马上执行该函数，把函数的返回值，赋值给onclick

Obj.onclick = myclick;

也可以这样，好处是可以选择传参或者不传参

Obj.οnclick= function (){

         Myclick();

}

 

现代事件处理程序指派方式

需要判定浏览器

document.attachEvent

         是IE 则值为true，不是为false

 

 

Document.addEventListener : 是火狐浏览器则是true 不是为false

 

阻止事件冒泡：

1.      Event.stopPropagation();

 

一个事件如果返回值为false，可以组织元素的默认行为。

 

window.onload = function(){

           var xdiv = document.getElementById("xxdiv");

           //阻止右键弹出并且还有其他事件显示

           document.oncontextmenu = function(){

                    xdiv.style.display ="block";

                    return false;

           }

       }

 

得到事件对象：

 

IE:

Var a = window.event

 

Dom

Var a=arguments[0]

 

 

鼠标事件：

Mousemove