您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 咨询培训 > JavaScript核心对象2
1JavaScript核心对象2回顾什么是JavaScript如何在HTML中引用JavaScript什么是变量及其作用域JavaScript支持的基本数据类型JavaScript支持的运算符什么是表达式数组条件语句循环语句JavaScript函数3目标使用核心对象使用核心对象的方法和属性4对象对象中包含定义对象自身的属性(变量)及用于处理数据的方法(函数)。要访问对象属性,必须指定对象名及属性:objectName.propertyName要访问对象方法,必须指定对象名及需要的方法:objectName.method()5使用对象创建网页时,可以插入:–浏览器对象–内置脚本语言对象(根据使用的脚本语言的不同而不同)–HTML元素也可以创建自已的对象,并在程序中使用。6对象操作语句JavaScript是一种基于对象(Object-Based)的语言,而不是面对对象(object-oriented)的语言。JavaScript中的对象操作语句:–this语句–for…in语句–with语句–new语句7this语句this语句的值指示当前对象,并且可以拥有标准属性,如名称、长度以及相应的值。只能用在函数作用域或其调用引用内。用法:this[.属性名]HTMLHEADscriptlanguage=JavaScriptfunctiondispname(name){alert(欢迎进入JavaScript世界,+name);}/script/HEADFORMB输入您的名字:/BINPUTTYPE=textNAME=text1SIZE=20onChange=dispname(this.form.text1.value)/FORM/HTML8for...in语句for…in语句用于在对象的各个属性,或数组的各个元素之间循环用法:for(variableinobject){statements;}HTMLHEADSCRIPTLANGUAGE=JavaScriptcolor=newArray(红色,蓝色,绿色);for(varpropincolor){varrecord=color;record+=prop+=+color[prop]+BR;document.write(record);}/SCRIPT/HEAD/HTML9new语句new操作符用于新建对象类型实例。用法objectName=newobjectType(param1[,param2]...[,paramN])HTMLHEADSCRIPTLANGUAGE=JavaScriptfunctionemployee(name,code,designation){this.name=namethis.code=codethis.designation=designation}newemp=newemployee(JohnDias,A001,职员);document.write(雇员姓名:+newemp.name+BR);document.write(雇员代号:+newemp.code+BR);document.write(头衔:+newemp.designation);/SCRIPT/HEAD/HTML10with语句with语句用于执行一组语句,所有这些语句都假定引用指定的对象。用法with(object){statements;}HTMLHEADSCRIPTLANGUAGE=JavaScriptvara,b,c;varr=10;with(Math){a=PI*r*r;b=r*cos(PI);c=r*sin(PI/2);}document.write(a+BR);document.write(b+BR);document.write(c+BR);/SCRIPT/HEAD/HTML11eval语句eval函数用于计算代码串,而不引用任何特定对象。用法eval(string)HTMLSCRIPTLANGUAGE=JavaScriptvarx=5;varz=10;document.write(eval(x+z+5));/SCRIPT/HTML12字符串对象字符串对象用于操纵和处理文本字符串。用法stringName.propertyNamestringName.methodName创建字符串的方法–使用var语句,并对为其赋值(可选)–使用赋值运算符(=)及变量名–使用string()构造函数13字符串对象的属性和方法属性–length方法–big–blink–bold–fontcolor–italics–small–……14字符串对象示例HTMLHEADscriptlanguage=Javascriptvarbstr=大号;varsstr=小号;varblstr=粗体;varblkstr=“闪烁”;varucase=大写;varlcase=小写;document.write(BR这是+bstr.big()+文本);document.write(BR这是+sstr.small()+文本);document.write(BR这是+blstr.bold()+文本);document.write(BR这是+blkstr.blink()+文本);document.write(BR这是+ucase.toUpperCase()+文本);document.write(BR这是+lcase.toLowerCase()+文本);/script/HEAD/HTML15math对象Math对象拥有可用于表示复杂数学运算的属性和方法属性–PI–LN10–E方法–abs(number)–sin(number)–cos(number)–……16math对象示例HTMLSCRIPTLANGUAGE=JavaScriptfunctiondoCalc(x){vara;a=Math.PI*x*x;alert(半径为+x++的圆的面积为++a);}/SCRIPTBODYbgColor=whiteFORM输入圆的半径:INPUTTYPE=TEXTsize=5name=radBRBRINPUTtype=buttonvalue=显示面积onclick=doCalc(rad.value)/FORM/BODY/HTML17Date对象Date是内置对象,包含日期和时间信息。Date对象无属性,但有许多方法可以用来设置、获取和操作日期用法:DateObject=newDate(parameters)18Date对象方法set方法组get方法组to方法组parse和UTC方法组19Date对象示例HTMLHEADSCRIPTlanguage=JavaScript!--—vardayname=newArray(日,一,二,三,四,五,六);varthedate=newDate(2003/12/25)document.write(p2003年的圣诞节是星期+dayname[thedate.getDay()]);thedate.setYear(2004);document.write(p2004年的圣诞节是星期+dayname[thedate.getDay()]);//--/SCRIPT/HEAD/HTML20事件对象概念事件可以由用户生成,也可以由系统生成每个事件都有与之相关联的Event对象Event对象提供下列信息:–事件类型–事件发生时光标的位置Event对象可以用作事件处理程序的一部分21事件的生命周期事件的生命周期通常包含下列阶段:–与发生的事件相关联的用户操作或条件–立即更新Event对象以反映事件的状态–触发事件–调用相关联的事件处理程序–事件处理程序执行其操作并返回22JavaScript---获取事件信息JavaScript中:window.event或event对象获取事件信息调用其keyCode获取按键的键位号event.keyCode----返回对应键位的值event.shiftKey----如果触动了shift键则返回trueevent.ctrlKey----如果触动了ctrl键则返回trueevent.altKey----如果触动了alt键则返回true可以进行一些键位的屏蔽23Html事件onClick---单击事件onChange---值改变事件onFocus---获取焦点onBlur---失去焦点onMouseOver---鼠标移动onMouseOut---鼠标离开onLoad---加载事件onSubmit---提交事件onMouseDown---鼠标按下onMouseUp---鼠标弹起24onClick事件示例HTMLHEADSCRIPTLANGUAGE=JavaScript!--functioncompute(form){if(confirm(“确定吗?”))form.result.value=eval(form.expr.value);elsealert(请重试。);}//--/SCRIPT/HEADBODYFORM请输入表达式:INPUTTYPE=textNAME=exprSIZE=15BRINPUTTYPE=buttonVALUE=计算ONCLICK=compute(this.form)BR结果:INPUTTYPE=textNAME=resultSIZE=15BR/FORM/BODY/HTML25onChange事件示例HTMLHEADSCRIPTLANGUAGE=JavaScriptfunctioncheckNum(num){if(num==){alert(请输入一个数字值);returnfalse;}if(isNaN(num)){alert(请输入一个数字值);returnfalse;}elsealert(谢谢!);}/SCRIPT/HEADBODYbgColor=whiteFORM请输入一个数字:INPUTtype=textsize=5onChange=checkNum(this.value)/FORM/BODY/HTML26onFocus/onBlur事件示例HTMLBODYBGCOLOR=lavenderFORMINPUTtype=textname=text1onblur=(document.bgColor='aqua')onfocus=(document.bgColor='dimgray')/FORM/BODY/HTML27onMouseOver/onMouseOut事件示例htmlheadscriptlanguage=javascriptvarnum=0;functionshowLink(num){if(num==1){document.forms[0].elements[0].value=您选择了baidu;}if(num==2){document.forms[0].elements[0].value=您选择了163;}if(num==3){document.forms[0].elements[0].value=您选择了sina;}}/script/headbodyforminputtype=textsize=60/formahref=#onMouseOver=showLink(1)baidu/abrahref=#onMouseOver=showLink(2)163/abr
本文标题:JavaScript核心对象2
链接地址:https://www.777doc.com/doc-3650474 .html