第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt

上传人(卖家):晟晟文业 文档编号:5170837 上传时间:2023-02-15 格式:PPT 页数:64 大小:157.50KB
下载 相关 举报
第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt_第1页
第1页 / 共64页
第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt_第2页
第2页 / 共64页
第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt_第3页
第3页 / 共64页
第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt_第4页
第4页 / 共64页
第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt_第5页
第5页 / 共64页
点击查看更多>>
资源描述

1、第第5章章 网页行为语言网页行为语言JavaScriptJavaScript是制作网页的行为(Behavior)语言之一。5.1 JavaScript简介简介脚本程序既可以在服务器端运行,也可以直接在浏览器端运行(称为客户端脚本)。JavaScript是一种基于对象(Object)和事件驱动(Event Driven)的脚本语言。5.2 把把JavaScript加到网页中的方法加到网页中的方法5.2.1 在在HTML文档中嵌入脚本程序文档中嵌入脚本程序JavaScript的脚本程序包括在HTML中,使之成为HTML文档的一部分。其格式为:script language=JavaScript J

2、avaScript JavaScript语言代码语言代码;JavaScriptJavaScript语言代码语言代码;/Script【例5-1】需要提醒的是,在中的程序代码有大、小写之分,例如将document.write()写成Document.write(),程序将无法正确执行。【例5-2】5.2.2 链接脚本文件链接脚本文件引用外部脚本文件的格式为:head s c r i p t s r c 脚本文件的扩展名为.js,内容是脚本,不能包含HTML标记。其格式为:JavaScriptJavaScript语言代码语言代码;/注释注释JavaScriptJavaScript语言代码语言代码;J

3、avaScriptJavaScript语言代码语言代码;【例5-3】5.2.3 在标记内添加脚本在标记内添加脚本可以在可以在HTMLHTML表单的输入标记符内添加脚本,以响应输入的事件。表单的输入标记符内添加脚本,以响应输入的事件。【例【例5-45-4】5.3 JavaScript5.3 JavaScript的基本数据类型和表达式的基本数据类型和表达式JavaScriptJavaScript脚本语言同其他计算机语言一样,有它自身的基本数据脚本语言同其他计算机语言一样,有它自身的基本数据类型、运算符和表达式。类型、运算符和表达式。5.3.1 5.3.1 基本数据类型基本数据类型JavaScrip

4、tJavaScript有有4 4种基本的数据类型。种基本的数据类型。numbernumber(数值)类型。(数值)类型。stringstring(字符)类型。(字符)类型。booleanboolean(布尔)类型。(布尔)类型。objectobject(对象)类型。(对象)类型。JavaScriptJavaScript还有一个特殊的数据类型还有一个特殊的数据类型undefinedundefined(未定义)。(未定义)。5.3.2 常量常量1基本常量基本常量(1)字符型常量(2)数值型常量(3)布尔型常量2特殊常量(1)空值(2)控制字符5.3.3 变量变量1变量的命名变量的命名2变量的类型变

5、量的类型3变量的声明变量的声明变量的声明和赋值语句变量的声明和赋值语句var的语法为:的语法为:var var 变量名称变量名称1=1=初始值初始值1,1,变量名称变量名称2=2=初始值初始值2 2 ;一个一个var可以声明多个变量,其间用可以声明多个变量,其间用“,”分隔。分隔。4变量的作用域变量的作用域5.3.4 运算符和表达式双目运算符格式如下:操作数1 运算符 操作数21算术运算符2字符串运算符3比较运算符4布尔运算符5位运算符6运算符的优先顺序5.4 JavaScript的程序结构的程序结构5.4.1 简单语句简单语句1赋值语句赋值语句格式为:变量名变量名 =表达式表达式 ;2注释语

6、句注释语句单行注释语句的格式为:/注释内容注释内容多行注释语句的格式为:/*注释内容注释内容 注释内容注释内容 */3输出字符串(1)用document对象的write()方法输出字符串document对象的write()方法的功能是向页面内写文本,其格式为:document.write(字符串1,字符串2,);(2)用window对象的alert()方法输出字符串window对象的alert()方法的功能是弹出提示对话框,其格式为:alert(字符串);其应用见例5-1。4输入字符串(1)用window对象的prompt()方法输入字符串其格式为:prompt(提示字符串提示字符串,默认值字

7、符串默认值字符串);var name=prompt(请输入您的姓名:,);document.write(您好!+name);(2)用文本框输入字符串【例5-5】【例5-6】5.4.2 程序控制语句1条件语句(1)if else语句if else语句的格式为:if(条件)语句段1;else 语句段2;“条件”要用()括起来。【例5-7】(2)switch语句switch语句的格式为:switch(表达式)case 值1:语句段1;break;default:缺省语句段;例如,下面程序段根据输入的水果英文名称i,给出水果的价格。switch(i)case Oranges:document.writ

8、e(Oranges are$0.59 a pound.);break;case Apples:document.write(Apples are$0.32 a pound.);break;case Bananas:document.write(Bananas are$0.48 a pound.);break;case Cherries:document.write(Cherries are$3.00 a pound.);break;default:document.write(Sorry,we are out of +i+.);【例5-8】2循环语句循环语句(1)for循环语句for循环语句的

9、格式为:for(for(初始化初始化;条件条件;增量增量)语句段语句段;【例5-9】下面代码利用for循环自动显示标记的各级标题:for(i=1;i=6;i+)document.write(本行是+i+级标题);(2)while循环语句while循环语句的格式为:while(while(条件条件)语句段语句段;例如,下面的while循环当n小于3时重复执行循环体。n=0 x=0while(n 3)n+x+=n【例5-10】(3)do while语句do while语句是while的变体,其格式为:do do 语句段语句段;while(while(条件条件)例如,在下面程序中,do循环至少执行一

10、次,并且重复执行直到i不再小于5。do i+=1 document.write(i);while(i5);(4)标号语句label语句格式为:标号名称标号名称:语句语句;(5)break语句break语句的功能是无条件跳出循环结构或switch语句。【例5-11】(6)continue语句continue语句的功能是结束本轮循环,跳转到循环的开始处,从而开始下一轮循环。【例5-12】5.4.3 函数函数1函数的定义函数的定义JavaScript并不区分函数(Function)和过程(Procedure),在JavaScript中只有函数。JavaScript也遵循先定义函数,后调用函数的规则。

11、定义函数的格式为:function function 函数名函数名(参数参数1,1,参数参数2,2,)语句段语句段;return return 表达式表达式;/;/returnreturn语句指明被返回的值语句指明被返回的值【例5-13】2函数的调用函数的调用(1)无返回值的调用如果函数没有返回值或调用程序不关心函数的返回值,可用下面的格式调用定义的函数:函数名函数名(传递给函数的参数传递给函数的参数1,1,传递给函数的参数传递给函数的参数2,2,););(2)有返回值的调用如果调用程序需要函数的返回结果,则要用下面的格式调用定义的函数:变量名变量名=函数名函数名(传递给函数的参数传递给函数的

12、参数1,1,传递给函数的参数传递给函数的参数2,2,););例如,result=multiple(10,20);。对于有返回值的函数调用,也可以在程序中直接利用其返回的值。例如,document.write(multiple(10,20);。(3)在超链接标记中调用函数当单击超链接时,可以触发调用函数。有两种方法:使用标记的onClick属性调用函数,其格式为:)热点文本热点文本 /a 使用标记的href属性,其格式为:)热点文本热点文本 /a【例5-14】(4)在装载网页时调用函数有时希望在装载(执行)一个网页时仅执行一次JavaScript代码,这时可使用标记的onLoad属性,其代码形式

13、为:head function function 函数名函数名(参数表参数表)当网页装载完成后执行的代码当网页装载完成后执行的代码;/scriptbody onLoad);网页的内容网页的内容/body【例5-15】3全局变量与局部变量全局变量与局部变量【例5-16】4JavaScript内置的函数内置的函数(1)escape()和unescape()(2)eval()(3)parseInt()和parseFloat()(4)isNaN()5.5 基于对象的基于对象的JavaScript语言语言1对象对象(1)对象的概念JavaScript中的对象是由属性(properties)和方法(met

14、hods)两个基本的元素构成的。用来描述对象特性的一组数据,也就是若干个变量,称为属性。用来操作对象特性的若干个动作,也就是若干函数,称为方法。在JavaScript中,可以使用的对象有:JavaScript的内置对象 由浏览器根据Web页面的内容自动提供的对象 用户自定义的对象。JavaScript中的对象名、属性名与变量名一样要区分大小写。(2)对象的使用要使用一个对象,有下面3种方法:引用JavaScript内置对象。由浏览器环境中提供。创建新对象。一个对象在被引用之前必须已经存在。(3)对象的操作语句1)forin语句。forin语句的基本格式为:for(for(变量变量 in in

15、对象对象)语句段语句段;【例5-17】2)with语句。with语句的基本格式为:with(with(对象对象)语句段语句段;该语句的功能用于声明一个对象,代码块中的语句都被认为是对这一对象属性进行的操作。3)this关键字。this用于将对象指定为当前对象。4)new关键字。使用new可以创建指定对象的一个实例。其创建对象实例的格式为:对象实例名对象实例名=new new 对象名对象名(参数表参数表););5)delete操作符。delete操作符可以删除一个对象的实例。其格式为:delete delete 对象名对象名;2对象的属性对象的属性对象属性的引用有3种方式。(1)点()运算符把点

16、放在对象实例名和它对应的属性之间,以此指向一个惟一的属性。属性的使用格式为:对象名对象名.属性名属性名 =属性值属性值;例如:一个名为person的对象实例,它包含了sex、name、age 3个属性,对它们的赋值可用如下代码:person.sex=female;person.name=Jane;person.age=18;(2)对象的数组下标通过“对象下标”的格式也可以实现对象的访问。在用对象的下标访问对象属性时,下标是从0开始,而不是从1开始的。例如前面代码可改为:person0=female;person1=Jane;person2=18;通过下标形式访问属性,可以使用循环操作获取其值。

17、对上面的例子可用如下方式获取每个属性的值:function show_number(person)for(var i=0;i3;i+)document.write(personi);若采用forin语句,则不知其属性的个数也可以实现:function show_number(person)for(var prop in this)document.write(thisprop);(3)通过字符串的形式实现通过“对象字符串”的格式实现对象的访问:personsex=female;personname=Jane;personage=18;3对象的事件对象的事件事件就是对象上所发生的事情。4对象的方

18、法对象的方法其格式为:对象名对象名.方法方法()()例如,引用person对象中已存在的一个方法howold(),则可使用:document.write(person.howold();如果引用math内部对象中sin()的方法,则:with(math)document.write(sin(30);document.write(sin(75);若不使用with,则引用时相对要复杂些:document.write(math.sin(30);document.write(math.sin(75);5.6 JavaScript的内置对象的内置对象JavaScript编程中经常用到的内置对象的特点和使

19、用方法,包括:数组对象 字符串对象 日期对象 时间对象 数学对象 .JavaScript中提供的内部对象按使用方法可分为两种情况:一种是动态对象,必须使用new关键字创建一个对象实例。一种是静态对象,不需要使用new关键字创建对象实例。5.6.1 数组对象数组对象1数组对象的定义方法数组对象的定义方法数组对象的定义有3种方法:var var 数组对象名数组对象名=new Array();new Array();var var 数组对象名数组对象名=new Array(new Array(数组元素个数数组元素个数););var var 数组对象名数组对象名=new Array(new Array

20、(第第1 1个数组元素的值个数组元素的值,第第2 2个数组元素的值个数组元素的值,););例如,定义数组:order=new Array();/定义有0个数组元素的数组order12=abc123;/用 引用数组下标第2种方法。例如,定义数组:var person=new Array(10);/定义有10个数组元素的数组person20=Jhon;/为数组元素赋值,数组自动扩充为21个元素第3种方法。例如:新建一个名为person的数组,其中包含ZhangSan、LiSi、WangWu 3个元素。var person=new Array(ZhangSan,LiSi,WangWu);【例5-18

21、】【例5-19】2数组对象的属性数组对象的属性数组对象的属性主要是length,它用于获得数组中元素的个数,即数组中最大下标加一。3数组对象的方法数组对象的方法 sort(function)reverse()concat(array1,arrayn)join(string)slice(start,stop)tostring()【例5-20】5.6.2 字符串对象字符串对象1字符串(字符串(String)对象的定义方法)对象的定义方法String对象是动态对象。其格式为:字符串变量名字符串变量名 =字符串字符串;字符串变量名字符串变量名 =new String(new String(字符串字符串

22、););2字符串对象的属性字符串对象的属性字符串对象的最常用属性是length,功能是得到字符串的字符个数。例如:var myUrl=http:/;var myUrlLen=myUrl.length;/或 var myUrlLen=http:/.length;3字符串对象的方法字符串对象的方法String对象的方法主要用于字符串在Web页面中的显示、字体大小、字体颜色、字符的搜索以及字符的大小写转换。anchor(字符串):为字符串对象中的内容两端加上HTML的定位锚点标记,如同文本。例如:var strcmp=机械工业出版社网站;strcmp=strcmp.anchor(机工);得到的str

23、cmp值为:机械工业出版社网站1ink():用于创建一个超链接。【例5-21】5.6.3 日期对象日期对象1日期对象的定义方法日期对象的定义方法日期对象的定义方法有4种:1)其格式为:var var 日期对象名日期对象名 =new Date();new Date();2)其格式为:varvar日期对象名日期对象名 =new Date(milliseconds);new Date(milliseconds);3)其格式为:varvar日期对象名日期对象名 =new Date(string);new Date(string);4)其格式为:varvar日期对象名日期对象名 =new new Dat

24、e(year,month,day,hours,mintuesDate(year,month,day,hours,mintues,seconds,milliseconds);,seconds,milliseconds);2日期对象的方法日期对象的方法Date对象没有提供直接访问的属性。只具有获得日期、时间,设置日期、时间,格式转换的方法。(1)获取日期、时间的方法获得日期、时间的方法主要有:getYear():得到当前年份数。getMonth():得到当前月份数,0代表一月,1代表二月,11代表12月。getDate():得到当前日期数。getDay():得到当前星期几。getHours():得

25、到当前小时数。getMinutes():得到当前分钟数。getSeconds():得到当前秒数。getTimeZoneOffset():得到时区的偏移信息。(2)设置日期和时间的方法设置日期、时间的方法主要有:setFullYear():设置年份。setMonth():设置月份。setDate():设置日数。setHours():设置小时。setMinutes():设置分钟。setSeconds():设置秒数。(3)格式转换的方法格式转换的方法主要有:toGMTString():转换成格林威治标准时间表达的字符串。toLocaleString():转换成以当地时间表达的字符串。toString

26、():把时间信息转换为字符串。parse:从表示时间的字符串中读出时间。UTC:返问从格林威治标准时间到指定时间的差距(单位为ms)。【例5-22】【例5-23】5.6.4 数学对象数学对象数学对象是静态对象,不能用new关键字创建对象的实例,数学对象的调用方式为:Math.Math.数学函数名数学函数名(参数表参数表)1数学对象的属性数学对象的属性与其他对象属性不同的是,数学对象中的属性是只读的,可以使用的常数包括:E:代表数学常数e(=2.7182)。LN10:10的自然对数(=2.30259)。LN2:2的自然对数(=0.69315)。PI:圆周率(=3.1415926)。SQRT1_2

27、:1/2(即0.5)的平方根(=0.7071)。SQRT2:2的平方根(=1.4142)。LOG2E:以2为底e(自然对数的底)的对数(=1.44269)。LOG10E:以10为底e(自然对数的底)的对数(=0.4349)。数学对象的常量和函数与其他对象一样,是区分大小写的。2数学对象的方法数学对象的方法数学对象的主要函数包括:sin(a):求a的正弦值。cos(a):求a的余弦值。tan(a):求a的正切值。asin(a):求a的反正弦值。acos(a):求a的反余弦值。atan(a):求a的反正切值。exp(a):求a的指数。log(a):求a的自然对数。pow(base,exponent

28、):求base为底,exponent为指数的乘方值。round(a):对a进行四舍五入运算。floor(a):得到不大于a的最大整数。sqrt(a):求a的平方根。abs(a):求a的绝对值。random():取随机数,返回01之间的伪随机数。max(a,b):取a和b中的较大者。min(a,b):取a和b中的较小者。数学对象中,函数的参数均为浮点型,且三角函数中的参数为弧度值。【例5-24】5.7 自定义对象自定义对象1初始化对象初始化对象这是一种通过初始化对象的值,来建立自定义对象的方法。初始化对象的一般格式为:对象对象=属性属性1:1:属性值属性值1;1;属性属性2:2:属性值属性值2;

29、2;属性属性n:n:属性值属性值n;n;2定义对象的构造函数定义对象的构造函数这种方法的一般格式为:function function 对象名对象名(属性属性1,1,属性属性2,2,属性属性n)n)this.this.属性属性1=1=属性值属性值1;1;this.this.属性属性2=2=属性值属性值2;2;this.this.属性属性n=n=属性值属性值n;n;this.this.方法方法1=1=函数名函数名1;1;this.this.方法方法2=2=函数名函数名2;2;this.this.方法方法m=m=函数名函数名m;m;【例5-25】5.8 DOM对象及编程对象及编程如图5-22所示,

30、显示了DOM对象的从属关系。5.8.1 窗口对象窗口对象1属性属性它的主要属性有:closed:用于判断一个窗口是否被关闭。下面一行代码可关闭当前窗口:关闭窗口下面代码将在2s后关闭当前页:setTimeout(window.close();,2000);opener:存放open()方法打开窗口的父窗口。defaultstatus:浏览器状态栏默认的显示信息。status:浏览器状态栏当前显示的信息。【例5-26】print:打印当前窗口中的内容。【例5-27】document、location、history:这3个下级对象也被作为window对象的属性。【例5-28】2方法方法windo

31、w对象的主要方法有:1)open(URL,windowName,parameterList):根据页面地址、窗口名称、窗口风格打开一个窗口。【例5-29】2)alert(text):弹出警告框,参数为警告信息。3)confirm(text):弹出确认框,参数为确认信息。4)prompt(text,defaultText):弹出提示框,参数为提示信息和默认值。【例5-30】5)setTimeout(functionName(),schedule time):延时schedule time ms(毫秒)后调用functionName()函数。【例5-31】5.8.2 文档对象文档对象文档(docu

32、ment)对象包含当前网页的各种特征,如标题、背景、使用的语言等。1属性属性主要属性有:title:文档标题。lastmodified:文档最后修改时间。URL:文档对应的页面地址。cookie:用来创建和获得信息Cookie。bgcolor:文档的背景色。fgcolor:文档的前景色。location:保存文档所有的页面地址信息。alinkcolor:激活链接的颜色。linkcolor:链接的颜色。vlinkcolor:已浏览过的链接颜色。【例5-32】2方法方法主要方法有:write(text):向页面内写文本或标签(不换行)。writeln(text):向页面内写文本或标签,在最后一个字

33、符后换行。open():打开一个新文档。close():关闭当前文档。【例5-33】5.8.3 位置对象位置对象位置(location)对象提供了与当前打开的URL一起工作的方法和属性。1属性属性主要属性有:protocol:通信协议。host:页面所在Web服务器的主机名称。port:服务器通信的端口号。pathname:页面在服务器上的路径。hash:页面跳转的锚标信息。search:提交到服务器上进行搜索的信息。hostname:记录主机名称和端口号,中间用“:”分开。href:完整的URL地址。2方法方法主要方法有:assign(URL):将页面导航到另一个地址上去。reload:将页

34、面全部刷新。replace(URL):使用制定的URL所对应的页面代替当前页面。5.8.4 历史对象历史对象历史(history)对象含有以前访问过的URL地址。1属性属性主要属性是length,它反映浏览器访问历史记录的数量。2方法方法主要方法有:back():加载前一个浏览过的URL。forward():加载后一个浏览过的URL。go(int):载入相对于整数个位置之前或之后的链接。例如,history.go(6)表示进入历史清单中后面的第6个URL,history.go(-3)表示进入历史清单之前的第3页。【例5-34】5.9 JavaScript的对象事件处理程序的对象事件处理程序5.

35、9.1 对象的事件对象的事件对象事件有3类:用户引起的事件,如网页装载、表单提交等。引起页面之间跳转的事件,主要是超链接。表单内部与界面对象的交互,包括界面对象的改变等。这类事件可以按照应用程序的具体功能自由设计。5.9.2 常用的事件及处理常用的事件及处理1浏览器事件浏览器事件浏览器事件主要由Load、unLoad、DragDrop以及Submit等事件组成。(1)Load事件Load事件发生在浏览器完成一个窗口或一组帧的装载之后。onLoad句柄在Load事件发生后由JavaScript自动调用执行。例如:网页开始显示时并不触发Load事件,只有当所有元素包含图像、声音等被加载完成后才触发

36、Load事件。【例5-35】(2)Unload事件Unload事件发生在用户在浏览器的地址栏中输入一个新的URL。【例5-36】(3)Submit事件Submit事件在完成信息的输入,准备将信息提交给服务器处理时发生。【例5-37】(4)DragDrop事件DragDrop将一个对象拖放到浏览器窗口中。2鼠标事件鼠标事件常用的鼠标事件有MouseDown、MouseMove、MoMseUp、MouseOver、MouseOot、C1ick、Blur以及Focus等事件。(1)MouseDown事件(2)MouseMove事件(3)MouseUp事件(4)MouseOver事件(5)MouseO

37、ut事件【例5-38】(6)Click事件【例5-39】(7)Blur事件【例5-40】(8)Focus事件【例5-41】3键盘事件键盘事件(1)KeyDown事件(2)KeyPress事件(3)KeyUp事件(4)Change事件【例5-42】(5)Select事件(6)Move事件(7)Resize事件5.9.3 错误处理错误处理1Error事件事件【例5-43】2错误处理语句错误处理语句(1)throw语句throw语句用于扔出异常。其语法格式为:throw expression;throw expression;throw 装载错误;(2)try和catch语句try和catch语句需

38、要结合使用,一起支持异常处理的过程,其语法格式为:try try statements;/statements;/扔出异常扔出异常 catch(exception)catch(exception)statements;/statements;/处理异常处理异常 5.9.4 表单对象与交互性表单对象与交互性调用Form对象的一般格式为:input type=/form1Text单行单列输入元素单行单列输入元素功能:对Text标识中的元素实施有效的控制。属性:name:设定提交信息时的信息名称。对应于HTML文档中的name。value:用以设定出现在窗口中对应HTML文档中value的信息。de

39、faultvalue:包括Text元素的默认值。方法:blur():将当前焦点移到后台。select():加亮文字。事件:onFocus:当Text获得焦点时,产生该事件。onBlur:当元素失去焦点时,产生该事件。onselect:当文字被加亮显示后,产生该文件。onchange:当Text元素值改变时,产生该文件。【例5-44】2Textarea多行多列输入元素多行多列输入元素功能:对Textarea中的元素进行控制。属性:name:设定提交信息时的信息名称,对应HTML文档Textarea的name。value:设定出现在窗口中对应HTML文档中value的信息。defaultvalue

40、:元素的默认值。方法:blur():将输入焦点失去。select():加亮文字。事件:onBlur:当失去输入焦点后产生该事件。onFocus:当输入获得焦点后,产生该文件。onChange:当文字值改变时,产生该事件。onSelect:加亮文字,产生该文件。3Select选择元素选择元素功能:实施对滚动选择元素的控制。属性:name:设定提交信息时的信息名称,对应文档select中的name。value:用以设定出现在窗口中对应HTML文档中value的信息。length:对应文档select中的length。options:组成多个选项的数组。selectIndex:指明一个选项。text

41、:选项对应的文字。selected:指明当前选项是否被选中。index:指明当前选项的位置。defaultselected:默认选项。事件:onBlur:当select选项失去焦点时,产生该文件:onFocas:当select获得焦点时,产生该文件。onChange:选项状态改变后,产生该事件。【例5-45】4Button按钮按钮功能:对Button按钮的控制。属性:name:设定提交信息时的信息名称,对应文档中button的name。value:设定出现在窗口中对应HTML文档中value的信息。方法:click():该方法类似于单击一个按钮。事件:onclick:当单击button按钮时,

42、产生该事件。下例演示一个单击按钮的事件:【例5-46】5checkbox检查框检查框功能:实施对一个具有复选框中元素的控制。属性:name:设定提交信息时的信息名称。value:用以设定出现在窗口中对应HTML文档中value的信息。checked:该属性指明框的状态true/false。defauitchecked:默认状态。方法:click():使得框的某一个项被选中。事件:onclick:当框被选中时,产生该事件。下面程序中,单击链接,将显示是否选中复选框的提示:Check MeAm I Checked?6Password口令口令功能:对具有口令输入的元素的控制。属性:name:设定提交

43、信息时的信息名称,对应HTML文档中password中的name。value:设定出现在窗口中对应HTML文档中value的信息。defaultvalu:默认值。方法:select():加亮输入口令域。blur():失去passward输入焦点。focus():获得password输入焦点。7submit提交元素提交元素功能:对一个具有提交功能按钮的控制。属性:name:设定提交信息时的信息名称,对应HTML文档中submit。value:用以设定出现在窗口中对应HTML文档中value的信息。方法:click():相当于单击submit按钮。事件:onclick:当单击该按钮时,产生该事件。

44、【例5-47】6Password口令口令功能:对具有口令输入的元素的控制。属性:name:设定提交信息时的信息名称,对应HTML文档中password中的name。value:设定出现在窗口中对应HTML文档中value的信息。defaultvalu:默认值。方法:select():加亮输入口令域。blur():失去passward输入焦点。focus():获得password输入焦点。7submit提交元素提交元素功能:对一个具有提交功能按钮的控制。属性:name:设定提交信息时的信息名称,对应HTML文档中submit。value:用以设定出现在窗口中对应HTML文档中value的信息。方

45、法:click():相当于单击submit按钮。事件:onclick:当单击该按钮时,产生该事件。【例5-47】7在Web页面中用中文显示当天的日期和星期,如2006年3月19日星期日。请把下面代码加到其他网页中:today=new Date();function date()this.length=date.arguments.length for(var i=0;ithis.length;i+)thisi+1=date.argumentsi;var d=new date(星期日,星期一,星期二,星期三,星期四,星期五,星期六);document.write(,today.getYear()

46、,年,today.getMonth()+1,月,today.getDate(),日,dtoday.getDay()+1,);8.使用window.confirm(提示文本),弹出一个确认框时,如果用户单击【确定】按钮,则网页中显示“OK!”;如果单击【取消】按钮,则网页中显示“Cancel!”。9制作一个Web页面,当鼠标悬停(onmouseover)在按钮上时,Web页面从白色自动变为红色(document.bgColor=red)。10制作一个口令检测的JavaScript程序,要求能够判断输入口令是否正确,并给出提示。11根据当前机内的时间,显示不同时段的欢迎内容。12设计一个简单的报时程序,单击页面中的【报时】按钮,显示当前机内的日期和时间。13当打开网页时,显示“欢迎光临”对话框;关闭浏览器窗口时,显示“再见”对话框。14文字循环向上滚动,当光标移动到文字上时,文字停止滚动;光标移开则继续滚动。15在网页中显示一个工作中的时钟。16把下载的JavaScript浮动广告代码加到自己的网页中。

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 办公、行业 > 各类PPT课件(模板)
版权提示 | 免责声明

1,本文(第5章-网页行为语言-JavaScript-网页设计与制作教程(第3版)-教学课件.ppt)为本站会员(晟晟文业)主动上传,163文库仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。
2,用户下载本文档,所消耗的文币(积分)将全额增加到上传者的账号。
3, 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(发送邮件至3464097650@qq.com或直接QQ联系客服),我们立即给予删除!


侵权处理QQ:3464097650--上传资料QQ:3464097650

【声明】本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是网络空间服务平台,本站所有原创文档下载所得归上传人所有,如您发现上传作品侵犯了您的版权,请立刻联系我们并提供证据,我们将在3个工作日内予以改正。


163文库-Www.163Wenku.Com |网站地图|