Web技术实验指导书

《Web技术》实验指导书北京工商大学计算机与信息工程学院2011年3月目录实验一使用Dreamweaver制作HTML页面...............................................................................3实验二CSS及JavaScript实验......................................................................................................3实验三MyEclipse使用..................................................................................................................4实验四JSP技术应用实验..............................................................................................................4实验五JSP动作..............................................................................................................................5实验六JSP的jsp:useBean动作使用..........................................................................................5实验七JSP内置对象——request对象和response对象.............................................................6实验八JSP内置对象——out对象和session对象......................................................................6实验九JSP使用技巧......................................................................................................................6实验十MySQL数据库使用...........................................................................................................7实验十一JSP数据库应用开发（4学时）...................................................................................7实验一使用Dreamweaver制作HTML页面【实验目的】掌握使用Dreamweaver制作HTML页面的方法【实验内容】1．使用HTML制作一个页面，要有背景颜色，页面显示内容及格式如下图所示。2．制作一个页面，上有文字、图像和朋友的E.mail地址，在文字和图像上创建超级链接，单击链接时，页面跳转到其他页面，单击E.mail地址时，打开信箱，发送邮件。3．制作一个计算器界面，界面如下图所示。4．用Dreamweaver布局模式布局如下页面，页面主题自定。TopLeftBodyBottomTop:显示logo图片和页面的标题。Left:登录模块Body:当前页面的主要显示区域。Bottom:显示版权信息。【实验报告】将实验文件发送到老师的电子信箱。实验二CSS及JavaScript实验【实验目的】掌握CSS及JavaScript的使用方法【实验内容】1.定义一个main.css文件，在其中设置超链接的颜色、访问过的超链接的颜色，颜色自定。另外，设计两个HTML页面，在其中创建超链接，并链接main.css文件，观察超链接的颜色。2.使用JavaScript脚本来验证用户输入的用户名是否为空，并要求密码的长度必须大于6，根据用户的输入给出相应的提示。3.页面上有一幅图像，在状态栏显示有关图像的说明。单击图像时，换成另一幅图像，同时状态栏的内容也做相应的变更。4．（选做）制作一个页面，页面上有两个文本框和提交按钮，在第一个文本框中输入信息后，用鼠标单击提交按钮后，将在第二个文本框显示输入的内容。【实验报告】将实验文件发送到老师的电子信箱。实验三MyEclipse使用【实验目的】掌握MyEclipse的使用【实验内容】1.检查MyEclipse的配置1）查找当前的Tomcat配置，分析其参数含义；2）查找当前的JDK配置，分析其参数含义。2.使用MyEclipse建立一个WebProject，并修改其中的默认jsp文件，使其显示“欢迎进入JSP开发学习！”，并部署和运行，观察效果。【实验报告】将实验文件发送到老师的电子信箱。实验四JSP技术应用实验【实验目的】掌握JSP脚本元素和指令元素【实验内容】1．应用JSP技术在浏览器中输出4行由大变小的文字。提示：可通过for循环来实现。2．应用Date对象读取系统当前时间，根据不同的时间段，在浏览器输出不同的问候语，例如上午0~12点之间输出“早上好”，同时把系统的年、月、日、小时、分、秒和星期输出到用户的浏览器。提示：(1)Date对象的getYear()方法获得的是1900年之后的年数，所以系统的年应该在其返回值上加1900.(2)Date对象的getMonth()方法的返回值从0开始，即0代表1月份，所以系统的月应该在其返回值上加1.(3)返回日期的函数为getDate()，返回星期的函数为getDay()，返回小时、分钟和秒数的函数分别为getHours(),getMinutes()和getSeconds()。3．加载静态文件。制作一个HTML文件，在页面上输出一行文字，例如“include指令的使用。”等。然后制作一个JSP文件，应用include指令加载刚制作的HTML文件，在客户端显示出来，并在客户端的“查看源文件”中观察源文件。提示：（1）如果被包含的文件中包含中文并且为html文件的话，会出现乱码，设置字符集也无法解决，要尽量避免这种情况，可以将被包含文件设置为.jsp文件来解决。（2）如果被包含的文件为.jsp文件的话，只要在其中设置字符集，就不会出现乱码。【实验报告】将实验文件发送到老师的电子信箱。实验五JSP动作【实验目的】掌握JSP动作【实验内容】1．加载动态文件，制作一个JSP文件，计算一个数的平方根，然后再制作一个JSP文件，应用jsp:include动作加载刚制作的JSP文件，在客户端显示出来，并在客户端的“查看源文件”中观察源文件。Math.sqrt()2．设计表单，制作读者选购图书的界面，当读者选中一本图书后，单击“确定”按钮，页面跳转到介绍该图书信息页面，请用“jsp:forwardpage=”语句。提示：需要至少3个文件，第一个为用户选购图书的页面，第二个文件接收用户输入的信息并根据用户的输入转向相应的页面，第三个页面显示图书的具体信息。如果有多本图书应该有多个图书介绍页面，在第二个文件中根据用户的选择分别转向它们。【实验报告】将实验文件发送到老师的电子信箱。实验六JSP的jsp:useBean动作使用【实验目的】掌握jsp:useBean动作的使用【实验内容】1．制作一个页面，页面的背景颜色，文字的大小、字体和颜色可以根据用户的选择来实施。界面如下图所示，要求应用JavaBean完成。注意：该实验用到JavaBean，在新建MyEclipse项目时，不用WebRoot目录，否则会出错。步骤：（1）编写JavaBean(如：pageBean)；（2）新建一个jsp文件（pageJavaBean.jsp），在其中使用pageBean，将其scope属性设置为session，并布局下图所示的页面元素。用户点击“确定”按钮后，将用户的选择提交到另外一个jsp文件，如（setBean.jsp）（3）新建setBean.jsp文件，将用户所选择的页面属性值更新至javaBean的属性值，然后转回pageJavaBean.jsp文件。2．（选做）应用JavaBean完成一个计数器的制作，计数器beans的范围是application的，由不同用户共享。【实验报告】将实验文件发送到老师的电子信箱。实验七JSP内置对象——request对象和response对象【实验目的】掌握JSP的request和response对象的使用【实验内容】1.制作一个购书页面，要求用户输入用户名和密码，并通过下拉菜单选择需要购买的图书，单击“确定”按钮，将信息发往服务器端，服务器端文件接收用户输入并输出用户名和所购图书。2.设计表单，制作读者选购图书的界面，当读者选中一本图书后，单击“确定”按钮，页面跳转到介绍该图书信息页面，要求使用response对象sendRedirect方法。【实验报告】将实验文件发送到老师的电子信箱。实验八JSP内置对象——out对象和session对象【实验目的】掌握out对象和session对象的使用【实验内容】有3个商店（即3个页面，供应不同的商品），应用session对象存储用户的用户名、密码和购物信息，当用户购物结束时，向用户返回其购物信息。【实验报告】将实验文件发送到老师的电子信箱。实验九JSP使用技巧【实验目的】【实验内容】1.制作一个用户登录界面，用户输入中文用户名后能够在参数接收页面读取用户输入的中文参数并进行显示。2.制作一个用户注册页面，分别用客户端方法和服务器端方法限制用户重复提交注册信息。【实验报告】将实验文件发送到老师的电子信箱。实验十MySQL数据库使用【实验目的】掌握MySQL数据库的使用【实验内容】1.启动MySQL的命令行管理工具，用MySQL的建库语句建立一个名为company的数据库。2.在company库中建立雇员表emp，表的数据项及数据类型如下所示：empnoint(4)notnullprimarykey,enamevarchar(10),jobvarchar(10),hiredatedatetime,salarydouble【实验报告】将实验文件发送到老师的电子信箱。实验十一JSP数据库应用开发（4学时）【实验目的】掌握JSP数据库应用开发【实验内容】建立一个JSP文件，通过JDBC连接实验十所建立的数据库，然后执行如下操作：在雇员表emp中插入几行测试数据（英文数据，日期格式为YYYY-MM-DD）。查看表中的数据。修改表中的某条记录。删除表中的某条记录。【实验报告】将实验文件发送到老师的电子信箱。