ch4 脚本语言-Web程序设计第三版源代码及课后习题.doc
【例4-1】程序如下：<html><head><title>函数简例</title> <script language="JavaScript">function factor(num) var i,fact=1; for (i=1;i<num+1;i+) fact=i*fact;return fact;</script></head><body><p><script>document.write("<br><br>调用factor函数，5的阶乘等于：",factor(5),"。");</script></p></body></html>【例4-2】设计一个函数求累加和，默认时求1+2+1000，否则按照用户所指定的开始值和终止值求和。<html><body><script>function sum(StartVal,EndVal) var ArgNum = sum.arguments.length; /用户给出的参数个数var i,s=0;if (ArgNum = 0 ) StartVal = 1; EndVal = 1000; else if (ArgNum = 1 )EndVal = 1000;for (i = StartVal; i<=EndVal; i+)s+=i;return s;document.write("不给出参数调用函数sum:",sum(),"<br>");document.write("给出一个参数调用函数sum:",sum(500),"<br>");document.write("给出二个参数调用函数sum:",sum(1,50),"<br>");</script></body></html>【例4-3】 变量作用域示例。<html><head><title>变量作用域示例</title><script language="JavaScript">var i, j=10; /全局变量function output( ) var j=0; /局部变量 i=100; /全局变量 j+; j+; document.write(" j=",j); document.write(" i=",i); i+;</script></head><body><br><br><script>document.write("尚未调用函数output()，所以i无定义，不能引用！<br>"); document.write("j的初始值=",j,"<br>"); document.write("调用output()，观察函数的输出！<br>"); output();document.write("<br>调用output()后，观察函数对i,j的影响：i=",i," j=",j);</script></body></html>【例4-4】本例使用for循环语句计算10！。<html><body> <script> var i,factor; factor=1; for (i=1;i<=10;i+) factor*=i; document.write("10的阶乘是：",factor); </script> </body></html>【例4-5】本例说明MouseOver和MouseOut事件的用法。<html><head><title>事件触发和事件处理</title><script language="JavaScript">var Images=new Array( );Images0=new Image( );Images0.src="dot1.jpg"Images1=new Image( );Images1.src="check.gif"function changeImg(ImgIndex) document.imgs.src=ImagesImgIndex.src;</script></head><body><center><a href="learn.html" onMouseOver="changeImg(1); return true" onMouseOut="changeImg(0); return true"><img src="dot1.jpg" name="imgs" border=0 width=30 height=30><font size=5>软件设计</font> </a></center></body></html> 【例4-6】简易计算器设计。以下是源程序清单：<html><head><script language="JavaScript"><!-/定义全局变量var n1='',n2='' /定义两个变量，分别存放两个操作数var item1_flag=true; /标志是否第一个操作数var opr_type='+' /运算类型function SetVal(item) /在输出框中置数值 document.Cal.OutText.value+=item; /字符串连接 if (item1_flag) /若是第一个操作数 n1+=item; /将其加入变量n1 else n2+=item;function SetOpr(opr)/在输出框中置运算符 document.Cal.OutText.value+=opr; item1_flag=false; opr_type=opr;function Clear( ) /清除输出框的内容 document.Cal.OutText.value="" item1_flag=true; opr_type='+' n1=" " n2=" "function Compute(obj) /计算表达式的值var Result;if (n1!='') && (n2!='')if (eval(n2)=0) && (opr_type='/') alert('除数不能是0!'); Clear( ); return; else Result=eval(obj.OutText.value); document.Cal.OutText.value+='=' document.Cal.OutText.value+=Result; /-></script></head><body><p align=center><form name="Cal" ><input type="text" value="" name="OutText"><br><br><input type="button" value=" 0 " onClick="SetVal('0')"><input type="button" value=" 1 " onClick="SetVal('1')"><input type="button" value=" 2 " onClick="SetVal('2')"><input type="button" value=" 3 " onClick="SetVal('3')"><br><br><input type="button" value=" 4 " onClick="SetVal('4')"><input type="button" value=" 5 " onClick="SetVal('5')"><input type="button" value=" 6 " onClick="SetVal('6')"><input type="button" value=" 7 " onClick="SetVal('7')"><br><br><input type="button" value=" 8 " onClick="SetVal('8')"><input type="button" value=" 9 " onClick="SetVal('9')"><input type="button" value=" + " onClick="SetOpr('+')"><input type="button" value=" - " onClick="SetOpr('-')"><br><br><input type="button" value=" * " onClick="SetOpr('*')"><input type="button" value=" / " onClick="SetOpr('/')"><input type="button" value=" CE " onClick="Clear()"><input type="button" value=" = " onClick="Compute(this.form)"></form></p></body></html>【例4-8】<html><body><script>function person(name,age) /定义对象person this.name=name; this.age=age; function book(title,author,publisher,price) /定义对象book this.title=title; this.author=author; this.publisher=publisher; this.price=price;function Show(obj) /定义通用函数Show var prop;for (prop in obj)document.write(objprop+" ");document.write("<br>");var obj1=new person("Mary",20);var obj2=new book("语文","集体编","人民教育出版社",5.5);Show(obj1);Show(obj2);</script></body></html>【例4-9】一个Array对象的应用示例。<html><head><title>数组对象</title><script language="JavaScript">function updateInfo(WhichBook) /对象book的方法成员，修改对象属性值 document.BookForm.currbook.value=WhichBook;document.BookForm.BookTitle.value=this.Title;document.BookForm.BookPublisher.value=this.Publisher;document.BookForm.BookAmount.value=this.Amount;function Book(title,publisher,amount) /对象book的构造函数 this.Title=title;this.Publisher=publisher;this.Amount=amount;this.UpdateInfo=updateInfo;</script></head><body><script language="JavaScript">var Books=new Array(); /创建数组，数组元素是book对象/为数组各元素赋值Books0=new Book("语文","少年儿童出版社",10000);Books1=new Book("数学","高等教育出版社",5000);Books2=new Book("普通物理","高等教育出版社",3000);Books3=new Book("计算机基础","清华大学出版社",2000); </script><h2 align=center>共有四本书，可选择查看其信息</h2><form name="BookForm">选择当前所显示的书： <input type=button value=A书 onClick="Books0.UpdateInfo('A书')"><input type=button value=B书 onClick="Books1.UpdateInfo('B书')"><input type=button value=C书 onClick="Books2.UpdateInfo('C书')"><input type=button value=D书 onClick="Books3.UpdateInfo('D书')"><br><br>当前书：<input type="text" name="currbook" value="A书"><br><br>书名：<input type="text" name="BookTitle" value="语文"><br><br>出版社：<input type="text" name="BookPublisher" value="少年儿童出版社"><br><br>印数：<input type="text" name="BookAmount" value="10000"></form></body></html>【例4-10】本例是一个有关Date对象的应用例子，该HTML文件在浏览器窗口显示一个不断刷新的数字钟。<html><head><title>数字钟</title> <style> form font-size:22px; input font-size:24px; color:red; width:180;height:40;</style><script language="JavaScript">function aClock( ) var now=new Date( ); var hour=now.getHours( ); var min=now.getMinutes( ); var sec=now.getSeconds( ); var timeStr=" "+hour; timeStr+=(min<10)?":0":":")+min; timeStr+=(sec<10)?":0":":")+sec; timeStr+=(hour>=12)?" P.M.":" A.M." document.clock_form.clock_text.value=timeStr; clockId=setTimeout("aClock( )",1000);</script></head><body onLoad="aClock( )"><br><br><br><form name="clock_form"> 当前时间是：<input type="text" name="clock_text" value=""></form></body></html>【例4-11】本例定义一个对象数组Obj，利用循环语句将Obj各项的值赋予各文本框。<html><head><title>For Each . Next语句示例</title></head> <script language="VBScript"> Sub cmdChange_OnClickSet Obj = CreateObject("Scripting.Dictionary")Obj.Add "0","文本1" '添加键和项目Obj.Add "1","文本2"Obj.Add "2","文本3" '将对象Obj各项目的值赋予各文本框 j=0For Each i in ObjDocument.textForm.Elements(j).Value = Obj.Item(i) j=j+1 Next End Sub </script> <body><center><form name="textForm"><input type = "Text"><p><input type = "Text"><p><input type = "Text"><p><input type = "Button" name="cmdChange" value="单击此处"><p></form></center></body></html>【例4-12】<html><head><title>Sub和Function示例</title><script language="VBScript">Sub Output( ) Dim input_val input_val=Document.OpForm.InputText.value Document.OpForm.OutputText.value=Factor(input_val)End SubFunction Factor(n) Dim i,m m=1 For i=1 To n m=m*i Next Factor=mEnd Function</script></head><body><center><form name="OpForm">请输入一个小于10的正整数：<input type=text name="InputText" size=6><p>输入数据后，按此按钮可在下框中得到所输入数的阶乘：<input type=button onClick="Call Output( )" value="显示结果"><p><input type=text name="OutputText" size=10></form></body></html>
