《 Java Web开发从入门到实战（第2版·微课视频版）》---实验教学大纲.doc

第PAGE21页共NUMPAGES21页

《JavaWeb开发从入门到实战（第2版·微课视频版）》实验教学大纲

大纲版本：v1.0

课程名称（中/英）：JavaWeb开发/JavaWebDevelopment

学分：3

实验学时：24（含实战）

课程类别：专业课

课程性质：必修课

开课学期：4

适用专业：软件工程、计算机科学与技术

先修课程：Java程序设计、数据库原理及应用

一、课程目标

《JavaWeb开发》是软件工程、计算机科学与技术等专业本科阶段的重要专业课程，该课程实验环境选用Eclipse或IntelliJIDEA。通过本课程的学习和上机实战操作，使学生掌握JavaWeb开发中JSP、Servlet以及Ajax、JSON、jQuery技术的基础知识和实际应用，熟练使用Eclipse或IntelliJIDEA集成开发工具进行JavaWeb开发。注重培养学生的实践与实战能力，掌握基本的JavaWeb开发创新方法和应用解决方案，为企业级Java应用开发打下坚实基础。

二、项目及课时分配

序号

项目名称

课时数

项目类别

项目类型

要求

每组人数

1

调查问卷制作

1

专业基础

设计性

必做

1

2

页面布局

1

专业基础

设计性

必做

1

3

表单验证

1

专业基础

设计性

必做

1

4

JSP脚本元素的应用

1

专业基础

设计性

必做

1

5

JSP动作标记的应用

1

专业基础

设计性

必做

1

6

JSP内置对象的应用

2

专业基础

设计性

必做

1

7

使用JavaBean计算三角形面积和周长

1

专业基础

设计性

必做

1

8

基于Servlet的登录验证

1

专业基础

设计性

必做

1

9

使用基于Servlet的MVC模式设计一个Web应用（四则运算）

1

专业基础

设计性

必做

1

10

会话跟踪技术的应用：登录注销系统

1

专业基础

设计性

选做

1

11

监听器的实际应用——统计在线用户

1

专业基础

设计性

选做

1

12

使用JSTL标签打印九九乘法表

1

专业基础

设计性

选做

1

13

使用PreparedStatement语句实现多条件查询

2

专业基础

设计性

选做

1

14

使用jQueryAjax技术实现注册邮箱的唯一性验证

1

专业基础

设计性

选做

1

15

综合实战1：基于JSP+JavaBean+Servlet的电子商务平台的设计与实现

8

专业综合

综合性

选做

1-3

三、教学方法

学生自己动手实验为主，老师指导为辅。

四、教学内容及要求

实验一调查问卷制作（1课时）

实验目的：

1、掌握HTML的常用标签；

2、认真书写实验报告，如实填写各项实验内容。

实验要求：

按照实验内容及实验报告要求，完成规定的实验内容，并认真填写实验报告。

实验内容：

编写网页practice1_1.html，具体要求如下：

（1）网页中有个form表单，表单处理程序为本页面程序，表单提交方式为“post”，表单提交编码方式为“multipart/form-data”；

（2）页面运行效果如图1所示。

图1practice1_1.html页面运行效果

主要设备和实验环境：

计算机，Eclipse或IntelliJIDEA集成开发工具

实验二页面布局（1课时）

实验目的：

1、掌握CSS的基本语法；

2、掌握常见的DIV+CSS布局类型；

3、认真书写实验报告，如实填写各项实验内容。

实验要求：

按照实验内容及实验报告要求，完成规定的实验内容，并认真填写实验报告。

实验内容：

按照下面的步骤编写网页practice1_2.html：

步骤1：使用DIV定义结构

一个典型的版面分栏结构：页头、导航栏、内容、版权。结构代码如下：

divid=header/div

divid=navigator/div

divid=content/div

divid=footer/div

将这四个盒子装进一个更大的盒子，body中，如下：

body

上面四行代码

/body

步骤2：定义body的属性

body{

font-family:Arial,Helvetica,sans-serif;

font-size:12px;

margin:0pxauto;

height:auto;

width:800px;

border:1pxsolid#006633;

}

步骤3：定义页头（header）的属性

#header{

height:100px;

width:800px;

background-image:url(plane.jpg);

background-repeat:no