javascript入门.ppt

1、Javascript系列课 (一),课程内容:,(课一)javascript简介: 调试 数据类型与变量 函数 事件 兼容性,安全性 (课二)文档对象模型: W3C DOM W3C DOM方法与非DHTML DOM方法的比较 DHTML性能 CSS (课三)Javascript面向对象 对象的定义 原型对象和继承 javascript内部核心构造函数 javascript命名空间,客户端JavaScript调试,alert(),document.write(); 注释(/); JavaScript:URL javascript:for(i=0;i); 使用调试器(VS.NET);,(一)基本语

2、法：与java,C#类似,数据类型：,弱命名，不需要预定义数据类型，解释器根据变量当前值和变量使用方法确定数据类型 var temp=5.8; temp = “Hello!”; temp =56; temp = false; temp=new Object(); 基本类型和引用类型 基本类型:数字,布尔 引用类型:Object,String, Array,Date 基本类型之间的转换： ）自动转换数据类型 var temp1 = 1; temp2= “2”; sum = temp1 + temp2; (“12”) sum = temp1 + temp2*5; (11) sum = (temp1

3、 + temp2)*5; (60),）显式转换 String():String(true)=”true”;String(null)=”null”;String(undefined)=“undefined”; Number()：Number(true)=1;Number(null)=0;Number(undefined)=NaN; Boolean();Boolean(0/NaN/null/undefined/”)=false; 3)从一个值中提取另一种数据类型 parseInt(String, NumberBase) parseInt(“ 100ab32c”)=100; parseInt(“23

4、”,8) = 19; parseFloat(String) 4)Null与undefined perty = null 返回true; perty=null返回false; typeof(perty)=typeof(null)返回false;,变量的作用域,使用var与不使用var的区别: 没有块级作用域,function change() var myScrop = “inScrop” /当去掉var后,myScrop表示全局变量 change(); alert(myScrop); /undefined,function test() for (var k

5、 = 0;k10;k+) document.write(k) document.write(k); ,定义函数:function与Function,function: 1)function A() 2)var f = function() ; Function(arg1,argn,body) func=new Function(a,b,alert(a);alert(b);); func(1,2); 缺点:每次使用时都要重新分析和解释，速度慢； 优点:实用于动态拼接程序；,函数参数,参数的不定性,可传递任意个参数 arguments属性 获取参数的个数 arguments.length 实际传入

6、的参数个数; functionName.lenght , arguments.callee.length 已经申明的参数个数;,function testArg(a,b) alert(a); alert(b); testArg(“a”,”b”,”c”,”d”);,function testArg(a,b) alert(arguments2); alert(argument3); ,函数的属性：,函数本身作为对象存在，可对其定义属性和方法（数作为构造函数时，方法和属性相当静态方法和属性）,function increase() increase.counter +; increase.count

7、er = 0;,事件和事件处理,作为性质的事件处理程序 作为JavaScript属性的事件处理程序 document.f1.b1.onclick = function () document.f1.b1.onclick = functionName; 显式调用事件处理程序 document.myform.onsubmit();,Event对象,全局变量Window的属性，提供了有关事件的各种信息 altKey,ctrlKey,shiftKey,button,keyCode clientX,clientY,offsetX,offsetY srcElement,fromElement,toElem

8、ent,type cancelBubble,returnValue, function changeFocus() if (event.keyCode=13) event.keyCode = 9; ,事件起泡(除blur,focus,load,unload外),event.srcElement指向最初触发事件的元素 终止事件起泡：event.cancelBubble=true, item1 item1 item1 function spanMsg() alert(“span事件,srcElement: + event.srcElement.firstChild.nodeValue); even

9、t.cancelBubble = true; function divMsg() alert(div事件,srcElement: + event.srcElement.firstChild.nodeValue); ,弹出窗口,window.alert window.confirm mpt window.showModalDialog window.showModelessDialog,showModalDialog,returnValue= window.showModalDialog(sURL ,vArguments , sFeatures),function showM

10、odal() arg = new Array(1,2,3); returnValue = window.showModalDialog(modalDialog.aspx,arg, dialogWidth=20;dialogHeight=20;scroll=no;center=yes;location=no;); function closeWin() arg = window.dialogArguments; window.returnValue = arg0 + arg1 + arg2; window.close(); ,兼容性:理想状态下的 ”独立于平台” 的语言.,浏览器的兼容性 特性检测,提供替代代码; if (document.getElementById) /支持W3C DOM API else if (document.all) /支持IE 4 API else if (document.layers) /支持Netscape 4 API else /不支持DHTML 语言版本的兼容性 非JavaScript浏览器的兼容性 1) 2) 不支持javascript显示的内容 ,安全性:,不支持在客户端写文件,删除文件,创建目录,