《Web技术应用基础_d06.ppt》由会员分享，可在线阅读，更多相关《Web技术应用基础_d06.ppt（87页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、JavaScript1JavaScript 了解JavaScript作用、工作机制和特点；了解Window对象构成、属性和方法掌握掌握Window对象基本使用方法对象基本使用方法 学会JavaScript的基本语法规则熟练掌握熟练掌握JavaScript编程技巧编程技巧脚本（脚本（Script)Script)应用知识点与技术要求：应用知识点与技术要求：Script是一种介于HTML与高级编程语言(如：Java、VB和C+等)之间的特殊语言，是由一组可以在Web服务器或客户端浏览器运行的命令的组合。脚本把网页对象和浏览器对象集成并组装起来，使网页具有动态动态效果和交互交互功能。26.1 Java
2、Script6.1 JavaScript概述概述6.1.1JJavaScript运行机制运行机制脚本是一种能够完成某些功能的小程序段。这些程序段脚本是一种能够完成某些功能的小程序段。这些程序段在程序运行过程中被逐行解释执行，脚本语言可嵌入在程序运行过程中被逐行解释执行，脚本语言可嵌入HTMLHTML页面，并被浏览器解释执行。页面，并被浏览器解释执行。服务器端脚本：服务器端脚本：在服务器上运行的脚本程序在服务器上运行的脚本程序 客户端脚本：客户端脚本：在客户机上运行的脚本程序在客户机上运行的脚本程序 JavaScript3JavaScript是一种嵌入是一种嵌入HTML文档中的、文档中的、跨平台
3、、基于对象和事件驱动的脚本语言，跨平台、基于对象和事件驱动的脚本语言，它即可以在客户端运行也可以运行在服务它即可以在客户端运行也可以运行在服务器上。器上。JavaScript46.1.2JavaScript特点特点1.JavaScript是一种脚本语言是一种脚本语言2.基于对象基于对象3.事件驱动事件驱动4.动态动态5.安全安全6.与平台无关与平台无关JavaScript5 6.1.3 6.1.3 JavaScriptJavaScript应用示例应用示例 图像互换位置图像互换位置 JavaScript61.任务要求要求页面上有两幅图像及有关图像的说明的文字，当用户用鼠标左键单击页面时，图像交换
4、位置。例例6.1JavaScript7ex6-01.html代码代码清单清单JavaScript应用案例应用案例functionChangeImage()vardog_top=dog.style.topvardog_left=dog.style.leftdog.style.top=cat.style.topdog.style.left=cat.style.leftcat.style.top=dog_topcat.style.left=dog_leftJavaScript8请单击页面请单击页面catdogJavaScript9代码说明代码说明(1)第第16至至19行：行：和和是块容器标记，之间可
5、以容纳多个不同是块容器标记，之间可以容纳多个不同的的HTML标记和语言元素。标记和语言元素。id=cat，指定该块容器的，指定该块容器的id值是值是cat。(2)第第3至至12行：当用户单击页面时，由使用行：当用户单击页面时，由使用JavaScript脚本语言编写的脚本语言编写的ChangeImage()函数完成事函数完成事件的处理，即图像交换位置的动作。件的处理，即图像交换位置的动作。JavaScript10 标记位于标记位于和和标记之间，在标记之间，在标记中的脚本段将在页面主体标记中的脚本段将在页面主体(即在即在标记中的内容标记中的内容)被浏览器载入之前解释执行。被浏览器载入之前解释执行。
6、标记位于标记位于和和标记之间时标记之间时,这这一段脚本程序将在一段脚本程序将在HTML文档被浏览器载入过程中文档被浏览器载入过程中被解释执行被解释执行 属性属性language是是script标记的必须指定的基本属性。标记的必须指定的基本属性。一般被指定为一般被指定为JavaScript或或VBScript。runat=Server表示该段脚本在服务器端执行，如果表示该段脚本在服务器端执行，如果省略，则表示该段脚本将发送到客户端运行。省略，则表示该段脚本将发送到客户端运行。脚本代码放在脚本代码放在HTML的注释标记的注释标记之间，这之间，这样做既不影响支持脚本的浏览器正确解释执行脚本样做既不影
7、响支持脚本的浏览器正确解释执行脚本程序；也可以使不支持脚本的浏览器把这段程序当程序；也可以使不支持脚本的浏览器把这段程序当作注释而旁路掉。作注释而旁路掉。JavaScript116.2JavaScript基本语法基本语法JavaScript是一种是一种跨平台跨平台、基于对象基于对象(Object)、事事件驱动件驱动(EventDriven)脚本语言，可以在于脚本语言，可以在于浏览器上浏览器上运行运行,也可以也可以运行在服务器上运行在服务器上。JavaScript由由JavaScript核心语言、核心语言、JavaScript客户端扩展和客户端扩展和JavaScript服务器端扩展三部分组成。核
8、心语言部分服务器端扩展三部分组成。核心语言部分包括包括JavaScript的基本语法和的基本语法和JavaScript的内置对象，的内置对象，在客户端和服务器端均可运行。在客户端和服务器端均可运行。作用：作用：与HTML超文本标记语言、Java小程序一起在一个Web页面中链接多个对象，与Web客户交互。JavaScript126.2.1在在HTML文档中调入或嵌入文档中调入或嵌入JavaScript1.JavaScript嵌入嵌入HTML文件文件语法规则：语法规则：language默认值：默认值：JavaScriptJavaScript例例6.213例6.2JavaScript嵌入嵌入HTML
9、document.write(HelloWorld!)JavaScript142.将将JavaScript调入调入HTML文件文件将将JavaScript代码以扩展名代码以扩展名“.js”单独存单独存放放语法语法:JavaScript156.2.2JavaScript书写格式书写格式 区分大小写区分大小写 可以可以没有可见行结束标志，没有可见行结束标志，换行符换行符作为行终止符。作为行终止符。也可以用也可以用(;)作为一行终止符。作为一行终止符。C语言、语言、C和和Java语言中，使用分号语言中，使用分号(;)作一行的结束标志作一行的结束标志 如果需要把几行代码写在一行，使用分号如果需要把几行
10、代码写在一行，使用分号(;)分开。分开。vara=3varb=6varc=0vara=3;b=6;c=0JavaScript16 为了使程序清晰易读，采用缩进格式来为了使程序清晰易读，采用缩进格式来书写。书写。可以用两种方法进行注释。注释方法与可以用两种方法进行注释。注释方法与C相同。相同。/：从注释标记：从注释标记“/”起直到行尾的字起直到行尾的字符都被忽略。符都被忽略。/*/：在：在“/*”与与“*/”之间的字符都之间的字符都被忽略。被忽略。JavaScript176.2.3基本数据类型基本数据类型1.数据类型数据类型 数值型数值型(整数和浮点数整数和浮点数)字符型字符型 布尔型布尔型(取
11、值为取值为true或或false)空值空值2.常量常量值保持不变的量值保持不变的量JavaScript183.变量变量关键字关键字“var”声明变量并分配存储空间，声明变量并分配存储空间，var为为可选项可选项 vara=3/声明变量，并赋初值声明变量，并赋初值 a=3/省略关键字省略关键字var vara/声明变量后声明变量后,赋值赋值a=6三种方法等效，但不能既不用关键字三种方法等效，但不能既不用关键字“var”也不赋初置。也不赋初置。变量名必须以变量名必须以字母字母或下划线或下划线“_”开始，后面的字符可以开始，后面的字符可以是字母、数字或下划线例：是字母、数字或下划线例：abc、a_1
12、2、myvar、MyVarJavaScript19JavaScript内部定义的保留字不能用作变量名。内部定义的保留字不能用作变量名。JavaScript区分区分大大小小写的，变量写的，变量Num与变量与变量num是两是两个不同的变量。个不同的变量。JavaScript的变量采用了的变量采用了弱类型弱类型(Looselytyped)表达表达方式方式,变量在声明时不必显式说明它的类型，而是在变量在声明时不必显式说明它的类型，而是在使用时使用时根据数据的类型来确定变量的类型。根据数据的类型来确定变量的类型。在函数体外声明为全局变量在函数体外声明为全局变量JavaScript提供四种类型变量：提供四
13、种类型变量：数值型：数值型：36，3.1415926，-3.1E12等等字符串型：字符串型：“Hello!”逻辑型：逻辑型：true，false空值型：空值型：nullJavaScript204.表达式表达式表达式是由变量、常量和运算符按一定规则组成的表达式是由变量、常量和运算符按一定规则组成的集合，表达式的值可以是数字、字符串或布尔量。集合，表达式的值可以是数字、字符串或布尔量。JavaScriptJavaScript有三种表达式有三种表达式:算术表达式、串表达式算术表达式、串表达式和逻辑表达式。和逻辑表达式。JavaScript215.运算符运算符.对象访问、数组下标、()括号；+增、-减
14、、-取负、位逻辑非、！逻辑非；delete、new、Typeof、this；*乘、/除、%取模、+加、-减；移位、小于、大于、=大于等于、=等于、!=不等于；&位或、位异或、|位与、&与、|逻辑或；=赋值；(Jscript是弱变量型的，可以重复赋值)?:条件运算。优先次序从前到后！JavaScript226.3JavaScript控制结构和函数控制结构和函数6.3.1JavaScript控制结构控制结构1.ifelseif(条件条件)/如果条件为如果条件为true，进行处理。进行处理。else/如果条件为如果条件为false，进行处理。进行处理。如果不需要处理如果不需要处理false情况，可不
15、写情况，可不写else语句段，例如：语句段，例如：if(条件条件)/如果条件为如果条件为true，进行处理。进行处理。JavaScript232.switch语句语句switch(表达式表达式)case值值1：语句集语句集1breakcase值值2：语句集语句集2breakdefault:语句集语句集breakJavaScript243.forfor循环语句设置了一个计数器计算循环次数，达到循循环语句设置了一个计数器计算循环次数，达到循环次数后结束循环。环次数后结束循环。for(初始化表达式；初始化表达式；条件；条件；增量表达式增量表达式)语句集语句集JavaScript254.循环语句循环语
16、句whilewhile循环语句不直接指明循环次数，具体循环次数由循环语句不直接指明循环次数，具体循环次数由运行时情况决定，满足循环条件执行循环体语句，不运行时情况决定，满足循环条件执行循环体语句，不满足循环条件退出循环体。满足循环条件退出循环体。语法规则语法规则：while(条件条件)语句段语句段break语句：根据条件终止循环。语句：根据条件终止循环。continue语句：根据条件，跳过循环体内剩余语句，语句：根据条件，跳过循环体内剩余语句，进入下一次循环。进入下一次循环。JavaScript266.3.2函数函数函数必须先定义，后使用。函数必须先定义，后使用。浏览器先执行浏览器先执行HTM
17、L文文档中的档中的模块，模块，JavaScript中常把自定义函数放中常把自定义函数放在在模块中，在模块中，在HTML文档主体文档主体中调用中调用函数。函数。函数定义的规则如下：函数定义的规则如下：function函数名函数名(参数列表参数列表)函数体函数体function：关键字，使解释程序知道后面定义函数关键字，使解释程序知道后面定义函数函数名函数名：可以是任何合法的标识符：可以是任何合法的标识符参数列表参数列表：函数的参数列表，多个参数用逗号分开：函数的参数列表，多个参数用逗号分开函数体函数体：函数执行的运算函数执行的运算JavaScript276.3.3JavaScript基本语法的应
18、用案例基本语法的应用案例例例6.3例例6.36.3JavaScript28例例6.3JavaScript基本语法应用案例基本语法应用案例/脚本语言是脚本语言是JavaScriptfunctionMyArray(n)/定义函数定义函数MyArraythis.length=nfor(iin4)thisi=0JavaScript29MyArray=newArray(4)MyArray1=WebMyArray2=技术技术MyArray3=应用应用MyArray4=基础！基础！document.open()for(varn=1;nMyArray.length;n+)document.write(MyAr
19、rayn);document.close()JavaScript306.4JavaScript对象对象6.4.1JavaScript对象概述对象概述对象具有:属性(properties)方法(methods)3种对象:JavaScript内建对象 浏览器环境提供的对象 自定义对象JavaScript316.4.2自定义对象自定义对象语法：语法：function对象名称对象名称(属性列表属性列表)this.属性属性1=参数参数1this.属性属性2=参数参数2this.方法方法1=函数名函数名1this.方法方法2=函数名函数名2JavaScript32创建对象实例语法：对象实例名=new对象名
20、称(属性值列表)JavaScript33functionstudent(id,name,url)this.id=idthis.name=namethis.url=urlthis.display=student_displayJavaScriptMyStudent=newstudent(000001,林琳林琳,http:/)定义学生对象定义学生对象学生对象实例学生对象实例346.4.3对象属性和方法的引用对象属性和方法的引用JavaScript1.对象属性的引用对象属性的引用语法：语法：对象实例名对象实例名.属性成员名属性成员名例例,MyStudent.name=林琳林琳。35语法：语法：对象实
21、例名对象实例名n例例,MyStudent0=000001MyStudent1=林琳林琳MyStudent2=http:/或：或：MyStudentid=000001MyStudentname=林琳林琳MyStudenturl=http:/JavaScript362.对象方法的引用对象方法的引用语法：语法：对象实例名对象实例名.方法名称方法名称()例如：例如：MyStudent.display()JavaScript376.4.4对象的操作对象的操作1.forin语句语句forin是操作对象的语句，也称是操作对象的语句，也称遍历遍历。遍历是指逐遍历是指逐一通过一个对象的所有属性，它的计数值是对象
22、中一通过一个对象的所有属性，它的计数值是对象中的的属性个数属性个数。语法：。语法：for(变量变量in对象对象)语句段语句段JavaScript382.with语句语句语法语法：with(对象实例名对象实例名)语句段语句段例：例：with(MyStudent)id=000001name=林琳林琳url=http:/JavaScript396.this关键词关键词用户引用当前所指的对象，格式:this属性名属性名JavaScript406.4.5事件驱动与事件处理事件驱动与事件处理onClick:鼠标左键单击对象时发生鼠标左键单击对象时发生Onload:网页载入浏览器时发生网页载入浏览器时发生o
23、nUnload:用户离开当前页面时发生用户离开当前页面时发生onMouseOver:鼠标移到对象上时发生鼠标移到对象上时发生onMouseOut:鼠标离开对象上时发生鼠标离开对象上时发生JavaScript416.4.6例例6.4JavaScript例例6.442例例6.4JavaScrip对象应用对象应用functionstudent(id,name,url)this.id=idthis.name=namethis.url=urlthis.display=student_displayJavaScript43functionstudent_display()document.writeln(
24、id=+thisid+)document.writeln(name=+thisname+)document.writeln(url=+thisurl+)MyStudent=newstudent(000001,林琳林琳,“http:/)MyStudent.display()JavaScript446.5window对象在对象在JavaScript中的应用中的应用6.5.1window对象构成对象构成对象有用户建立的对象，也有系统提供的对象有用户建立的对象，也有系统提供的内建对象内建对象。Window对象是内建对象中的最顶层对象。对象是内建对象中的最顶层对象。Window对对象指的是浏览器窗口对象
25、象指的是浏览器窗口对象。JavaScript45JavaScript466.5.2window对象的属性对象的属性1.window对象主要属性对象主要属性属性名称属性名称说明说明范例范例name当前窗口名字当前窗口名字window.nameparent当前窗口父窗口当前窗口父窗口parent.nameparent.nameself当前打开窗口当前打开窗口self.status=“self.status=“你你好好”top窗口集合中最顶层窗口窗口集合中最顶层窗口top.nametop.namestatus设置当前打开窗口状态设置当前打开窗口状态栏的显示数据栏的显示数据self.status=“s
26、elf.status=“欢欢迎迎”defaultStatus当前窗口状态栏的显示当前窗口状态栏的显示数据数据self.defaultStatself.defaultStatusus=“=“欢迎欢迎”JavaScript476.5.3window对象的方法对象的方法1.window对象的主要方法对象的主要方法alert():创建带创建带“确定确定”按钮的对话框按钮的对话框confirm():创建带创建带“确定确定”和和“取消取消“按钮对话框按钮对话框close():关闭当前打开的浏览器窗口关闭当前打开的浏览器窗口open():打开一个新浏览器窗口打开一个新浏览器窗口prompt():创建带创建带
27、“确定确定”、“取消取消“按钮及输入按钮及输入字符串字段对话框字符串字段对话框setTimeout():设置一个时间控制器设置一个时间控制器clearTimeout():清除原来时间控制器内时间设置清除原来时间控制器内时间设置JavaScript482.JavaScript的接口元素的接口元素 alert(提示提示)：显示显示警告框警告框，“提示提示”是可选项，是可选项，警警告框中输出的内容。告框中输出的内容。例：例：alert(alert(对不起，用户名错误。对不起，用户名错误。)JavaScript49 prompt(提示提示,缺省值缺省值)：显示显示提示框提示框，等待用户输，等待用户输入
28、文本，用户选择入文本，用户选择“确认确认”按钮，返回文本框中内容，按钮，返回文本框中内容，选择选择“取消取消”按钮，返回一个空字符串。按钮，返回一个空字符串。“提示提示”和和“缺省值缺省值”都是可选项，都是可选项，“缺省值缺省值”是文本框默认值是文本框默认值例：例：prompt(prompt(请输入姓名：请输入姓名：)JavaScript50comfirm(提示提示)：显示显示确认框确认框，等待用户选择按钮。，等待用户选择按钮。“提示提示”可选的，是在提示框中显示的内容，用户可可选的，是在提示框中显示的内容，用户可以根据提示选择以根据提示选择“确定确定”或或“取消取消”按钮按钮例：例：conf
29、irm(MyString+“你好！你好！链接到链接到ex07-002.html页面？页面？)JavaScript516.5.4window对象的事件对象的事件onLoad：网页载入浏览器时发生：网页载入浏览器时发生onUnLoad：网页从浏览器窗口中删除时发生：网页从浏览器窗口中删除时发生onBeforeUnLoad：网页被关闭前发生：网页被关闭前发生OnResize：用户调整窗口大小时发生：用户调整窗口大小时发生OnScroll：用户滚动窗口时发生：用户滚动窗口时发生OnError：载入的网页产生错误时发生：载入的网页产生错误时发生JavaScript526.5.5window对象应用案例对
30、象应用案例1.状态栏内容更新状态栏内容更新JavaScript例例6.553JavaScriptwindow对象属性的应用对象属性的应用54JavaScript552.打开一个新窗口打开一个新窗口JavaScript例例6.656例6.6window对象的对象的open()方法方法window对象的对象的open()方法方法JavaScript573.客户端输入信息验证客户端输入信息验证例例6.67：在客户端验证用户输入数据。页面上有一个在客户端验证用户输入数据。页面上有一个超级链接，当用户点击链接时，由超级链接，当用户点击链接时，由prompt提示框提示提示框提示用户输入姓名，然后用户输入姓
31、名，然后JavaScript程序验证用户输入，程序验证用户输入，如果输入正确弹出确认框如果输入正确弹出确认框confirm，若用户在确认框选若用户在确认框选择择“确认确认”按钮，则链接到网站；如果输入错误，出按钮，则链接到网站；如果输入错误，出现警告框现警告框alert，输出输出对不起，输入错误。对不起，输入错误。，程序终，程序终止止例例6.7JavaScript58JavaScript接口元素应用接口元素应用JavaScript59脚本应用你好！欢迎光临你好！欢迎光临tomcat！606.6document对象在对象在JavaSCript中应用中应用 6.6.1 document6.6.1
32、document对象对象属性属性alinkColor：活动超级链接的颜色：活动超级链接的颜色bgColor：页面背景颜色：页面背景颜色fgColor：页面前景颜色：页面前景颜色linkColor：页面中未曾访问过的超级链接的颜色：页面中未曾访问过的超级链接的颜色vlinkColor：页面中曾经访问过的超级链接的颜色：页面中曾经访问过的超级链接的颜色lastModified：最后一次修改页面的时间：最后一次修改页面的时间Location：页面的：页面的URL地址地址Title：页面的标题：页面的标题JavaScript616.6.2document对象方法clear():清除文件窗口内的数据cl
33、ose():关闭文档open():打开文档write():向当前文档写入数据JavaScript62document对象鼠标事件:onClick:单击鼠标左键时发生ondblClick:双击鼠标左键时发生onMouseDown:按下鼠标左键时发生onMouseMove:移动鼠标时发生onMouseOut:鼠标离开对象时发生onMouseOver:鼠标移到对象上时发生onMouseUp:放开鼠标左键时发生onSelectStart:开始选取对象内容时发生onDragStart:以拖曳方式选取对象时发生JavaScript63document对象按键事件:onKeyDown:按下按键时发生onKe
34、yPress:按下按键时发生onKeyDown事件，然后产生onKeyPress事件onKeyUp:放开按键时发生onHelp:按下系统定义的帮助键时发生JavaScript646.5.4window对象应用案例对象应用案例例例6.8文本框内容互换文本框内容互换任务要求：页面上有任务要求：页面上有2个文本框，用户在第个文本框，用户在第1个文本框个文本框输入内容后，点击第输入内容后，点击第2个文本框，将在第个文本框，将在第2个文本框内个文本框内显示第显示第1个文本框的内容。个文本框的内容。JavaScript例例6.8656.7JavaScript内置对象内置对象JavaScript不是纯面向对
35、象语言，不具备面向对象语言不是纯面向对象语言，不具备面向对象语言特性，如封装、继承和重载特性，如封装、继承和重载.JavaScript没有类功能，不没有类功能，不能通过类来创建对象。能通过类来创建对象。JavaScript创建对象有属性和方创建对象有属性和方法，对象被创建后，可以象使用函数一样来使用。用户法，对象被创建后，可以象使用函数一样来使用。用户除了自己创建对象外，除了自己创建对象外，JavaScript还提供了许多内置对还提供了许多内置对象供用户使用。象供用户使用。6.7.1String对象对象JavaScript666.7.2Math对象6.7.3Array对象语法：语法：数组对象实
36、例名数组对象实例名=newArray()例如：例如：vararr1=newArray()vararr2=newArray(8)JavaScript674.7.4.Date对象对象Date对象主要用于对系统日期和时间的操作。对象主要用于对系统日期和时间的操作。没有没有属性，有多种方法。语法形式：属性，有多种方法。语法形式：MyDate=newDate()建立了一个日期变量建立了一个日期变量MyDate，如果没有特别指定时如果没有特别指定时间，将把系统的机内时间放入间，将把系统的机内时间放入MyDate变量。变量。表表7-13列举了列举了Date对象主要方法和他们的使用说明对象主要方法和他们的使用
37、说明JavaScript686.7.5JavaScript内置对象应用案例例6.9JavaScript例例6.969JavaScript内置对象应用案例内置对象应用案例JavaScript70varBooks=newArray()Books0=newBook(算法与数据结构算法与数据结构,严蔚敏严蔚敏陈文博陈文博,清华大学出版社清华大学出版社)Books1=newBook(XML/JSP网页编程教材网页编程教材,吴艾吴艾,北京希望电子出版社北京希望电子出版社)Books2=newBook(英华大字典英华大字典,郑易里郑易里,商务印书馆商务印书馆)点击按钮查阅详细信息点击按钮查阅详细信息书书名名
38、:作作者者:出版社出版社:JavaScript716.8JavaScripy应用案例应用案例6.8.1数字钟数字钟例例6.10：制作一个页面，页面上显示制作一个页面，页面上显示“单击此处启动单击此处启动数字钟并统计页面持续时间数字钟并统计页面持续时间”。当用户单击文字时，。当用户单击文字时，启动数字钟，用以显示当前时刻和网页的持续时间启动数字钟，用以显示当前时刻和网页的持续时间例例6.10JavaScript72例例6.10启动数字钟统计页面持续时间启动数字钟统计页面持续时间!-functionEclock()varMyDate2=newDate()varMyTime2=MyDate2.get
39、Time()varTimeString2=现在的时间是现在的时间是:+MyDate2.getHours()+时时+MyDate2.getMinutes()+分分+MyDate2.getSeconds()+秒秒varMyHours3=0;MyMinutes3=0varMySeconds4=Math.round(MyTime2-MyTime1)/1000)MyHours3=Math.round(MySeconds4-1800)/3600)MyMinutes3=Math.round(MySeconds4-30)%3600)/60)JavaScript73if(MyMinutes3=60)MyMinu
40、tes3=0MySeconds4=Math.round(MySeconds4%3600)MySeconds3=Math.round(MySeconds4%60)varTimeString3=持续时间是持续时间是:+MyHours3+时时+MyMinutes3+分分+MySeconds3+秒秒Clock.innerHTML=TimeString2+TimeString3setTimeout(Eclock(),1000)-JavaScript74JavaScript75单击此处启动数字钟并统计网页持续时间单击此处启动数字钟并统计网页持续时间JavaScript766.8.2状态栏文字滚动显示状态栏
41、文字滚动显示例例6.11JavaScript 例例6.116.1177 例例6.11状态栏文字滚动显示状态栏文字滚动显示!-varScrText=欢迎学习欢迎学习“Web技术应用基础技术应用基础”!varLenText=ScrText.lengthvarWidth=80varPos=1-WidthfunctionScroll()Pos+varScroller=if(Pos=LenText)Pos=1-WidthJavaScript78if(Pos0)for(vari=1;i单击页面注意状态栏的变化单击页面注意状态栏的变化JavaScript796.8.2随机改变页面背景色例6.12例例6.12
42、JavaScript80例6.12背景色随机改变背景色随机改变varmybool=falsecolor_bar=newArray(3)for(vari=0;i255)mybool=falsecontinuecolor_bari=start_nummybool=truemybool=falseJavaScript81vara=color_bar0.toString(16)if(a.length2)a=(0+a)varb=color_bar1.toString(16)if(b.length2)b=(0+b)varc=color_bar2.toString(16)if(c.length2)c=(0+c)varmkcolor=(+#+a+b+c+)document.bgColor=mkcolordocument.write(背景背景色是：色是：+mkcolor+)JavaScript826.8.4鼠标跟随例6.13JavaScript例例6.1383例6.13鼠标跟随鼠标跟随JavaScript85鼠标移鼠标移动图像跟随效果动图像跟随效果JavaScript86作业与实验作业与实验JavaScript完完87