JavaScript程序设计实训报告书.docVIP

JavaScript程序设计实训报告 学号： 姓名： 班级： 指导教师： 实训时间：2011-6-20～2011-6-24 JavaScript程序设计实训报告 1 实训1 JavaScript基本操作 3 实训目的 3 实训内容 3 实训步骤 3 运行结果（采用抓图形式） 3 实训2 HTML文档基本操作 5 实训目的 5 实训内容 5 实训步骤 5 运行结果（采用抓图形式） 8 实训3 JavaScript语言基础操作 9 实训目的 9 实训内容 9 实训步骤 9 运行结果（采用抓图形式） 10 实训4 JavaScript基本语句的应用 11 实训目的 11 实训内容 11 实训步骤 11 运行结果（采用抓图形式） 13 实训5 函数的应用 14 实训目的 14 实训内容 14 实训步骤 14 运行结果（采用抓图形式） 15 实训6 对象编程的操作 16 实训目的 16 实训内容 16 实训步骤 16 运行结果（采用抓图形式） 25 实训7 事件处理的操作 26 实训目的 26 实训内容 26 实训步骤 26 运行结果（采用抓图形式） 28 实训8 浏览器对象的应用 29 实训目的 29 实训内容 29 实训步骤 29 运行结果（采用抓图形式） 30 实训1 JavaScript基本操作 实训目的 （1）熟练掌握HTML文件中编写JavaScript程序的基本操作。 （2）基本掌握Dreamweaver编写工具。 实训内容 编写一个JavaScript程序，实现在页面上输出“欢迎访问明日公司主页”。 实训步骤 （1）打开Dreamweaver,在“创建新项目”列中选择“HTML”。 （2）打开HTML网页代码，将title…/title标记间的内容改为“欢迎页“。 （3）在body…/body标记间编写如下代码，实现在页面上输出“欢迎访问明日公司主页“。 script language=javascript document.write(HR); document.write(h1欢迎访问明日公司主页/h1); document.write(HR); /script （4）单击“在浏览器中预览/调试“按纽，选择“预览在IE”，查看运行结果。 运行结果（采用抓图形式） 实训2 HTML文档基本操作 实训目的 （1）熟练掌握HTML文档中的常用标记。 （2）熟练应用框架进行网页布局。 实训内容 （1）应用HTML文档中的常用标记制作一个在线音乐网站主页，要求主页应用框架实现。 （2）在各个子页应用HTML文档中的表格标记。段落标记、文字标记、列表标记和图像标记等来显示个人网站的LOGO，图像，音乐歌词等相关信息。 （3）单击主页歌名超级链接时，显示歌词信息，并将歌词显示在指定的框架页。 （4）在线音乐网主页页面美观大方，以不同大小、不同颜色、不同样式和不同格式的网页信息展现给读者。 实训步骤 （1）打开Dreamweaver,在“创建新项目”列中选择“HTML”。 （2）将文件命名为“HTML文档基本操作.html.” （3）在首页中应用框架标记实现在音乐网主页的基本框架结构。框架页分别保存为top.html、left.html、main.html和bottom.html。 首页实现框架的完整代码如下。 html head meta http-equiv=Content-Type content=text/html; charset=gb2312 / title在线音乐网/title /head frameset rows=220,* frameborder=no border=0 framespacing=0 frame src=top.html name=topFrame scrolling=No noresize=noresize id=topFrame / frameset rows=*,159 cols=* framespacing=0 frameborder=no border=0 frameset rows=* cols=430,* framespacing=0 frameborder=no border=0 frame src=left.html name=leftFrame scrolling=No noresize=noresize id=leftFrame / frame src=main.html name=mainFrame id=mainFrame / /frameset frame src=bottom.html name=bottomFra