网页设计实验2.doc

实验二实验目的掌握客户端脚本编程的方法。使用Dreamweaver或记事本编辑工具。实验内容10对象的事件编写方法：使用Dreamweaver或记事本编辑工具，创建一个静态网页10.html或者10.htm。在文件里输入如下代码： Sub B1_onClick MsgBox 你单击了这个按钮。 End Sub 利用浏览器打开该网页，查看运行结果。11对象的事件编写方法：使用Dreamweaver或记事本编辑工具，创建一个静态网页11.html或者11.htm。在文件里输入如下代码： MsgBox 你单击了这个按钮。 利用浏览器打开该网页，查看运行结果。12WINDOW对象的两个方法：使用Dreamweaver或记事本编辑工具，创建一个静态网页12.html或者12.htm。在文件里输入如下代码： If confirm(你希望继续吗?) Then alert 你选择了继续 Else alert 你选择了结束 End If 利用浏览器打开该网页，查看运行结果。13定时器的使用：使用Dreamweaver或记事本编辑工具，创建一个静态网页13.html或者13.htm。在文件里输入如下代码： function timedMsg() var t=setTimeout(alert(5 seconds!),5000) 利用浏览器打开该网页，查看运行结果（注意浏览器的状态栏）。14Document对象的使用：使用Dreamweaver或记事本编辑工具，创建一个静态网页14.html或者14.htm。在文件里输入如下代码：document.bgcolor=document.abc.text.value 利用浏览器打开该网页，查看运行结果（在编辑框中输入任意6为16进制数如FF0000，点击按钮，注意：颜色为6位十六进制数）。15编辑框的对象的选择事件：使用Dreamweaver或记事本编辑工具，创建一个静态网页15.html或者15.htm。在文件里输入如下代码： 供选择用的文本框： 利用浏览器打开该网页，查看运行结果（先在编辑框输入内容，然后选择内容，看有什么反应）。16单选框的事件：使用Dreamweaver或记事本编辑工具，创建一个静态网页16.html或者16.htm。在文件里输入如下代码： Sub rr For i=0 to form1.R1.length-1 If form1.R1(i).checked then alert 你选择了 & form1.R1(i).value End If Next End Sub 你的爱好是： 养猫 养狗 养鸟 养鱼 利用浏览器打开该网页，查看运行结果，选择一个选项。17复选框的事件：使用Dreamweaver或记事本编辑工具，创建一个静态网页17.html或者17.htm。在文件里输入如下代码： Sub lst_onchange alert你的爱好是： & form1.lst.value End Sub你的爱好是：养猫养狗养鸟养鱼 利用浏览器打开该网页，查看运行结果，选择一个选项。附加：（1）理解并运行静态网页素材文件夹-切换图片文件夹中的实例。 其中setInterval(changeImg,timeInterval); 表示每间隔timeInterval时间就自动执行changeImg.切换图片.htm事件触发和事件处理 var Images=new Array(); Images0=1.bmp; Images1=2.jpg; function changeImg(ImgIndex) document.imgs.src=ImagesImgIndex; 图片自动切换.htm 例子：实现简单的图片切换 var curIndex=0; var timeInterval=1000; var arr=new Array(); arr0=1.jpg; arr1=2.jpg; arr2=1.bmp; setInterval(changeImg,timeInterval); function changeImg() if (curIndex=arr.length-1) curIndex=0; else curIndex+=1; document.obj.src=arrcurIndex; (2) 理解并运行静态网页素材文件夹-脚本中的实例。单击按钮切换背景颜色vb版.htm 单击按钮切换背景颜色vb版 sub abc() if (document.bgColor=#ff0000) then document.bgColor =yellow else document.bgColor = red end if end sub 背景颜色每隔一秒自动切换.htm 背景颜色每隔一秒自动切换 var curIndex=0;var myArray=new Array();myArray0=white;myArray1=Red;myArray2=Yellow;myArray3=Blue;myArray4=Purple;setInterval(changeBg,1000);function changeBg() if (curIndex=myArray.length-1) curIndex=0; else curIndex+=1; document.bgColor=myArraycurIndex; (3)理解并能运用网络资源，比如网页中的天气预报功能。 使用Dreamweaver或记事本编辑工具，创建