尚学堂马士兵JavaScript学习笔记.docx

1、尚学堂马士兵JavaScript学习笔记一、程序开发分为客户端、服务器端客户端开发的好处减少客户端到服务器端的往返。表单验证服务器端开发的好处web应用的核心逻辑集中管理胖客户端、瘦客户端二、客户端编程的主要技术javascript（最主要的）vbscriptjscriptappletactivex组件plug-in技术（价值在于：让专家级程序员开发新型语言）flash技术的最新发展jsdk包含的plug-inyahoo 的工具条XX搜索伴侣CNNIC网络实名等 3721三、学习资料msdnjscript参考CoreGuideJS15.zipCoreReferenceJS15.zipJavaS

2、cript手册中文.chmJavaScript 2005- Wrox - Professional Javascript For Web Developers.pdf四、JavaScript and ECMA versions五、JavaScript和Java的区别基于对象和面向对象 解释和编译 强变量和弱变量 JavaScript中变量声明，采用其弱类型。即变量在使用前不需作声明，而是解释器在运行时检查其数据类型x=1234; /数值型变量y“4321”; /字符型变量代码格式不一样 嵌入方式不一样 六、JavaScriptJavaScript是一种描述式语言，它与HTML结合起来，用于增强

3、功能，并提高与最终用于之间的交互性能由Netscape公司利用Sun的Java开发它是与Java完全不同的一种语言。虽然在结构和语法上与Java类似，但是，它只是函数式的语言。客户端的JavaScript 必须要有浏览器的支持JavaScript (ECMAScript)基础语法DOMDocument Object ModelBOMBrower Object ModelJavaScript/jscript / ECMAScriptavaScript是由Netscape公司开发 .它的前身是Live Script Microsoft发行jscript用于internet explorer 最初的

4、jscript和javascript差异过大，web程序员不得不痛苦的为两种浏览器编写两种脚本。于是诞生了ECMAScript,是一种国际标准化的javascript版本。现在的主流浏览器都支持这种版本。 七、ECMAScriptECMAScript并不与任何具体浏览器相绑定 一个完整的JavaScript实现是由以下3个不同部分组成的（见图1-1）： 核心（ECMAScript）文档对象模型（DOM）； 浏览器对象模型（BOM）。 八、在网页中加入JavaScript通过在网页中加入标记JavaScript的开始和结束，将JavaScript代码放到之间(1.htm)也可以引入一个外部的Ja

5、vaScript文件，这个JavaScript文件一般以.js作为扩展名(2.htm)原则上，放在之间。但视情况可以放在网页的任何部分(3.htm)一个页面可以有几个/Script，不同部分的方法和变量，可以共享。(4.htm)九、JavaScript的数据类型The primary (primitive) data types are: String Number Boolean The composite (reference) data types are: Object Array The special data types are: Null Undefined (var a;)十

6、、控制字符JavaScript中有些以反斜杠（）开头的不可显示的特殊字符。通常称为控制字符。b :表示退格符。f :表示换页。n :表示换行符。r :表示回车符。t :表示Tab符号。 :表示单引号本身。 :表示双引号本身。十一、类型转换十二、JavaScript基本语法变量JavaScript是一门弱类型的语言，所有的变量定义均以var来实现JavaScript的变量建议先定义，再使用JavaScript区分大小写虽然JavaScript可以不需定义即可直接使用变量，但不建议这么做(5.htm)十三、数组定义var arr = new Array(3);通过arr.length取得数组的长度

7、(6.htm)注释的写法和java的一样数组使用方式：myarray=new Array(num)myarray=new Array(value1,value2) aa = new Array(3); aa20 = 444; document.write (aa20);num不设定，则按数组默认的最大长度自动设定。例如： aa = new Array(); aa20 = 444; document.write (aa.length);十四、JavaScript基本语法运算符算术运算+、-、*、/、=、=、=(7.htm)逻辑运算与：&或：|非：!(8.htm)字符串运算符连接运算：+ (9.h

8、tm)取子集：substring(index1,index2) (10.htm)条件表达式条件?A:B (11.htm)十五、substring 方法返回位于String对象中指定位置的子字符串。strVariable.substring(start,end)String Literal.substring(start,end)参数start指明子字符串的起始位置，该索引从 0 开始起算。end指明子字符串的结束位置，该索引从 0 开始起算。说明substring方法将返回一个包含从start到最后（不包含end）的子字符串的字符串。substring方法使用start和end两者中的较小值作

9、为子字符串的起始点。例如，strvar.substring(0, 3)和strvar.substring(3, 0)将返回相同的子字符串。如果start或end为NaN或者负数，那么将其替换为0。子字符串的长度等于start和end之差的绝对值。例如，在strvar.substring(0, 3)和strvar.substring(3, 0)返回的子字符串的的长度是 3。十六、JavaScript基本语法控制语句if语句if(条件) else if(条件1) else(12.htm)while语句while(条件)13.htmswitch 语句switch(i) case i1: casei2

10、: default:(14.htm)for15.htmdowhile16.htmwhile17.htm十七、JavaScript内置类型typeof 返回值有六种可能： number, string, boolean, object, function, 和 undefined. typeof 操作符十八、字符串对象属性：length方法：字体控制： big() blink() bold() fixed() fontcolor(color) fontsize(size) Italics() small() anchor()字符串：toLowCase() toUpperCase() indexO

11、f(char,fromIndex) substring(start,end)big()、bold()、link()var strVariable = This is a string object;strVariable = strVariable.big().big().big().big().big().big().big().big().big();strVariable = strVariable.bold(); strVariable = strVariable.link();document.write(strVariable);This is a string objectsub

12、string、indexOfsubstring(start,end) 返回字符串的子字符串 案例：substring.htm indexOfcharactor,fromIndex 字符搜索 案例：indexOf.htm十九、Math对象常用方法：abs() 绝对值sin() , cos() 正弦余弦值asin() , acos() 反正弦反余弦 tan() , atan() 正切反正切round() 四舍五入sqrt() 平方根pow(x,y) x的y次方二十、Date对象创建方式： myDate = new Date();日期起始值:9年月日: 主要方法getYear(): 返回年数 set

13、Year(): 设置年数getMonth(): 返回月数 setMonth():设置月数getDate(): 返回日数 setDate():设置日数 getDay(): 返回星期几 setDay():设置星期数 getHours():返回小时数 setHours():设置小时数 getMinutes():返回分钟数 setMintes():设置分钟数 getSeconds():返回秒数 setSeconds():设置秒数getTime() : 返回毫秒数 setTime() :设置毫秒数二十一、JavaScript基本语法函数函数的使用利用function来定义一个函数 (18.htm)传入参

14、数 (19.htm)传出值 (20.htm)函数的参数传递preloadTreeImages(1.gif,2.gif,3.gif);function preloadTreeImages() for (var i = 0; i arguments.length; i+) var img = document.createElement(img); img.src = argumentsi; div1.appendChild(img); 二十二、JavaScript事件处理onFocus：在用户为了输入而选择select、text、textarea等时(onFocus.htm)onBlur：在se

15、lect、text、password、textarea失去焦点时(onBlur.htm)onChange：在select、text、textarea的值被改变且失去焦点时(onChange.htm/SelectionChange.htm)onClick：在一个对象被鼠标点中时（button,checkbox,radio,link,reset,submit,text,textarea等）(onClick.htm)onLoad：出现在一个文档完成对一个窗口的载入时(onLoad.htm)onUnload：当用户退出一个文档时(onload.htm)onMouseOver：鼠标被移动到一个对象上时(

16、onMouse.htm)onMouseOut：鼠标从一个对象上移开时(onMouse.htm)onSelect：当form对象中的内容被选中时(onSelect.htm)onSubmit：出现在用户通过提交按钮提交一个表单时(onSubmit.htm)二十三、JavaScript的对话框警告框(alert)：出现一个提示信息21.htm询问框(prompt)：返回输入的值22.htm确认框(confirm)：根据不同的选择，返回true/false23.htm使用eval不使用evalalert (3+2);-32使用eval的上下文环境alert (eval(3) + eval(2);-5e

17、val()函数可以把一个字符串当作一个JavaScript表达式一样去执行它二十四、javascript hijacking函数劫持 通过替换js函数的实现来达到劫持这个函数调用的目的 this指的是当前的对象24.htm函数调用时使用thisobject.htm自定义对象,随时可以增加属性,方法class.htm定义类二十五、对象forinIn后跟一个对象，对此对象中的所有元素循环一次(25.htm 25_1.htm)with为一段代码建立一个缺省的对象，任何无对象的属性引用，都将使用该缺省的对象(26.htm)new用于生成一个新的对象(27.htm)二十六、TryCatchtry doc

18、ument.writeln(Beginnng the try block) document.writeln(No exceptions yet) / Create a syntax error eval(6 + * 3) document.writeln(Finished the try block with no exceptions)catch(err) document.writeln(Exception caught, ) document.writeln(Error name: + err.name) document.writeln(Error message: + err.me

19、ssage)窗口中的对象和元素(BOM)window当前窗口（28.htm）新开窗口（29.htm）通过本地窗口控制新开窗口 (30.htm)location获取或设置现有文档的URL (31.htm)history先前访问过的URL的历史列表常用方法：back()，go(number)(32.htm/33.htm)document当前的文档对象document.write()：向客户端浏览器输出内容document.formName：可以用这个方法得到表单名称document.referrerwindow当前窗口（28.htm）新开窗口（29.htm）通过本地窗口控制新开窗口 (30.htm

20、)二十七、location获取或设置现有文档的URL (31.htm)history先前访问过的URL的历史列表常用方法：back()，go(number)(32.htm/33.htm)document当前的文档对象document.write()：向客户端浏览器输出内容document.formName：可以用这个方法得到表单名称document.referrer二十八、Browser Object Model技巧：setTimeout、setInterval /var a = window.setInterval(alert(Hello, world), 2000); var a = wi

21、ndow.setTimeout(alert(Hello, world), 2000); 趣味JavaScript程序黑客帝国(ex1/matrix.htm)鼠标跟随(ex2/mouseTrace.htm)找相同图片游戏(ex1/game/game.htm)飘浮的云(ex1/floating.htm)打字效果(ex1/printer.htm)TicTacToe游戏(ex1/tictactoe.htm)星球大战(ex1/starcraft/)实用JavaScript程序图片下拉列表(ex2/DropDown/)相互关联的列表(ex2/relative.htm)抽屉式菜单(ex2/drawer.ht

22、m)滑入式菜单（ex2/slip.htm）滚动下拉菜单 (ex2/pulldown.htm)日历(ex2/calendar)输入判断js函数(ex2/pd.*)window.open教程(window.open.htm)确实要删除该条记录吗 function a_onclick() var cv cv=window.confirm(确实要删除该条记录吗?) if(cv=true)return true elsereturn false 程序优化function a_onclick_new() event.returnValue=window.confirm(确实要删除该条记录吗?)学习HTML / CSS / JavaScript的方法googleAlert()重点掌握表单输入的判断prototype.js是由Sam Stephenson写的一个javascript类库Prototype is a JavaScript Framework that aims to ease development of dynamic web applications. 不可多得的Javascript(AJAX)开发工具 Aptana 掌握基本知识学会照猫画虎