课程结束报告 2.docx

课程结束报告 2.docx

《课程结束报告 2.docx》由会员分享，可在线阅读，更多相关《课程结束报告 2.docx（29页珍藏版）》请在冰豆网上搜索。

课程结束报告2

课程结束报告

课程名称:

基于WEB的网站开发技术

学生姓名:

学号:

学院:

数学与统计学院

专业:

信息与计算科学

任课教师:

2012年12月26日

目录

1.基本网页设计知识学习要点

1.1关于Html的主要标记学习要点

1.2我的Html设计与应用范例

1.3关于JavaScript知识要点

1.4JavaScript在html页面中的应用范例（如：

菜单设计示例、显示日期示例等）

1.5表单设计主要标签

1.6表单设计范例（如登陆窗口）

2.Jsp网站开发

2.1如何在html中嵌入java脚本？

设计一个学生类，并利用list存放一个班级的基本信息（5人左右）并在页面中利用表格显示出来。

2.2给出一个范例说明在jsp中利用JDBC建立到SQLServer2005的过程（最好给出一个范例及界面）

3.Struts2.X学习要点

3.1利用struts2.x页面的主要要素，给出一个利用struts2.x的示例页面

3.2请利用struts2.x设计一个登陆界面，若登陆成功返回登陆信息界面，否则返回登陆界面。

请给出完整的设计。

3.3设计一个学生类，利用list存放一个班级的基本信息（5人左右）并在页面中利用struts2.0的标签

iterator>、

property>在页面中显示出来。

3.4利用

tree>设计一颗静态树。

4.Hibernate3.x学习要点

4.1说明如何让你的webproject具有Hibernate3.XCapability?

4.2如何利用HibernateReserveEngineering生成某个表的基本DAO类

4.3请利用HibernateDAO将相关表中的数据在页面中展示出来。

成绩

基本网页设计知识学习要点

一、Html的主要标记

将HTML文档分成两部分：

首部信息和正文主体。

其具体的结构如下：

＜HTML＞

＜HEAD＞首部元素、元素属性及基本内容。

＜/HEAD＞

＜BOBY＞主体元素、元素属性及基本内容。

＜/BOBY＞

＜/HTML＞

介绍一些主要元素的含义。

1.主窗体元素含义

　　＜HTML＞和＜/HTML＞：

超文本的开始和结束。

　　＜HEAD＞和＜/HEAD＞：

超文本标题的开始和结束。

　　＜TITLE＞和＜/TITLE＞：

超文本窗口标题的开始和结束，它被显示在浏览器顶端的标题栏中。

　　＜META＞：

是用来描述HTML文档的元信息，即文档文档自身的信息。

　　＜BODY＞和＜/BODY＞：

正文的开始和结束，它被显示在浏览器中。

其中可以包含许多元素，是HTML语言的核心部分。

　　主要属性：

　　background="/url"：

指定背景图片，由属性url指定位置。

　　bgcolor=color：

指定文档中的背景颜色

　　text=color：

指定文档中的文本颜色

　　link=color：

指定尚未访问的超链接的颜色

　　alink=color：

指定活动的超链接的颜色

　　vlink=color：

指定访问过的超链接的颜色

　　HTML使用的颜色可用颜色十六进制的RGB值来表示，也可以用颜色英文名来表示，　　2.字符风格控制元素含义

　　＜H1＞＜/H1＞到＜H6＞＜/H6＞：

定义字体的大小。

　　＜B＞和＜/B＞：

字体加粗。

　　＜I＞和＜/I＞：

字体变斜体。

　　＜U＞和＜/U＞：

字体加下划线。

　　＜S＞和＜/S＞：

字体加中划线。

　　＜SUP＞和＜/SUP＞：

字体为上标。

　　＜SUB＞和＜/SUB＞：

字体为下标。

　　＜FONT＞和＜/FONT＞：

定义字体属性。

　　FONT的主要参数：

　　size：

定义字体的大小。

　　color：

定义字体的颜色。

　　center：

对齐方式。

3.版面控制元素含义

　　＜PRE＞到＜/PRE＞：

空格、回车有效。

　　＜ALIGN＞和＜/ALIGN＞：

对齐方式，主要参数有左对齐：

LEFT右对齐：

RIGHT居中对齐：

CENTER。

　　＜P＞和＜/P＞：

段落的开始和结束。

　　＜HR＞：

加划线。

　　＜IMGSRC=...＞：

插入图片。

4.标题分级控制元素含义

　　＜UL＞和＜OL＞：

标题分级方式。

　　＜LI＞：

子标题。

5.锚元素含义

　　＜ahref="链接地址"＞和＜/a＞：

锚元素的开始和结束。

　　例如：

　　"/"，是表示http链接。

　　"mailto:

info@"，是表示邮件链接。

　　"file:

//c:

/index.html"，是表示本地文件链接。

　　"ftp:

//

6.表格元素含义

　　＜TABLE＞和＜/TABLE＞：

表格的开始和结束。

　　＜CAPTION＞和＜/CAPTION＞：

表格标题的开始和结束。

　　＜TR＞和＜/TR＞：

行的开始和结束。

　　＜TH＞和＜/TH＞：

栏标题的开始和结束。

　　＜TD＞和＜/TD＞：

栏的开始和结束。

　　主要参数：

　　ALIGN：

横向定位

　　VALIGN：

纵向定位

　　BORDER：

表格边宽

　　COLSPAN：

单元所占栏数

　　ROWSPAN：

单元所占行数

7.交互元素含义

　　＜FORMNAME=""ACTION="URL"METHOD=GET|POST＞

　　＜INPUTTYPE="TEXT"＞：

文本框。

　　＜INPUTTYPE="PASSWORD"＞：

密码输入。

　　＜INPUTTYPE="CHECKBOX"＞：

单选框。

　　＜INPUTTYPE="RADIO"＞：

收音机按钮。

　　＜INPUTTYPE="IMAGE"＞：

图象。

　　＜SELECT＞和＜/SELECT＞：

下拉式选单。

　　＜SELECTMULTIPLE＞和＜/SELECT＞：

多项选择。

　　＜TEXTAREACOLS=NROS=N＞和＜/TEXTAREA＞：

文字输入区。

　　＜INPUTTYPE="SUBMIT"＞：

提交传送到服务器。

　　＜INPUTTYPE="RESET"＞：

清除已输入信息。

二、我的Html设计范例

三、JavaScript知识要点

1.document.write（""）;输出语句

2.传统的HTML文档顺序是:

document->html->（head,body）

3.一个浏览器窗口中的DOM顺序是:

window->（navigator,screen,history,location,document）

4.得到表单中元素的名称和值:

document.getElementById（"表单中元素的ID号"）.name（或value）

5.一个小写转大写的JS:

document.getElementById（"output"）.value=document.getElementById（"input"）.value.toUpperCase（）;

6.JS中的值类型:

String,Number,Boolean,Null,Object,Function

7.JS中的字符型转换成数值型:

parseInt（）,parseFloat（）

8.JS中的数字转换成字符型:

（""+变量）

10.JS中的取字符串长度是:

（length）

11.JS中的字符与字符相连接使用+号.

12.JS中的比较操作符有:

==等于,!

=不等于,>,>=,<.<=

13.JS中声明变量使用:

var来进行声明

14.JS中的判断语句结构:

if（condition）{}else{}

15.JS中的循环结构:

for（[initialexpression];[condition];[upadteexpression]）{insideloop}

16.循环中止的命令是:

break

17.JS中的函数定义:

functionfunctionName（[parameter],...）{statement[s]}

18.当文件中出现多个form表单时.可以用document.forms[0],document.forms[1]来代替.

19.窗口:

打开窗口window.open（）,关闭一个窗口:

window.close（）,窗口本身:

self

20.状态栏的设置:

window.status="字符";

21.弹出提示信息:

window.alert（"字符"）;

22.弹出确认框:

window.confirm（）;

23.弹出输入提示框:

window.prompt（）;

24.指定当前显示链接的位置:

window.location.href="URL"

25.取出窗体中的所有表单的数量:

document.forms.length

26.关闭文档的输出流:

document.close（）;

27.字符串追加连接符:

+=

28.创建一个文档元素:

document.createElement（）,document.createTextNode（）

29.得到元素的方法:

document.getElementById（）

30.设置表单中所有文本型的成员的值为空:

varform=window.document.forms[0]

for（vari=0;i

if（form.elements.type=="text"）{

form.elements.value="";}}

31.复选按钮在JS中判断是否选中:

document.forms[0].checkThis.checked（checked属性代表为是否选中返回TRUE或FALSE）

32.单选按钮组（单选按钮的名称必须相同）:

取单选按钮组的长度：

document.forms[0].groupName.length

33.单选按钮组判断是否被选中也是用checked.

34.下拉列表框的值:

document.forms[0].selectName.options[n].value（n有时用下拉列表框名称加上.selectedIndex来确定被选中的值）

35.字符串的定义:

varmyString=newString（"Thisislightsword"）;

36.字符串转成大写:

string.toUpperCase（）;字符串转成小写:

string.toLowerCase（）;

37.返回字符串2在字符串1中出现的位置:

String1.indexOf（"String2"）!

=-1则说明没找到.

38.取字符串中指定位置的一个字符:

StringA.charAt（9）;

39.取出字符串中指定起点和终点的子字符串:

stringA.substring（2,6）;

40.数学函数:

Math.PI（返回圆周率）,Math.SQRT2（返回开方）,Math.max（value1,value2）返回两个数中的最在值,Math.pow（value1,10）

返回value1的十次方,Math.round（value1）四舍五入函数,Math.floor（Math.random（）*（n+1））返回随机数

41.定义日期型变量:

vartoday=newDate（）;

42.日期函数列表:

dateObj.getTime（）得到时间,dateObj.getYear（）得到年份,dateObj.getFullYear（）得到四位的年份,dateObj.getMonth（）

得到月份,dateObj.getDate（）得到日,dateObj.getDay（）得到日期几,dateObj.getHours（）得到小时,dateObj.getMinutes（）得到

分,dateObj.getSeconds（）得到秒,dateObj.setTime（value）设置时间,dateObj.setYear（val）设置年,dateObj.setMonth（val）设置月

dateObj.setDate（val）设置日,dateObj.setDay（val）设置星期几,dateObj.setHours设置小时,dateObj.setMinutes（val）设置

分,dateObj.setSeconds（val）设置秒[注意:

此日期时间从0开始计]

43.FRAME的表示方式:

[window.]frames[n].ObjFuncVarName,frames["frameName"].ObjFuncVarName,frameName.ObjFuncVarName

44.parent代表父亲对象,top代表最顶端对象

45.打开子窗口的父窗口为:

opener

46.表示当前所属的位置:

this

47.当在超链接中调用JS函数时用:

（javascript:

）来开头后面加函数名

48.在老的浏览器中不执行此JS:

--//-->

49.引用一个文件式的JS:

50.指定在不支持脚本的浏览器显示的HTML:

51.当超链和onCLICK事件都有时,则老版本的浏览器转向a.html,否则转向b.html.例:

dfsadf

52.JS的内建对象

有:

Array,Boolean,Date,Error,EvalError,Function,Math,Number,Object,RangeError,ReferenceError,RegExp,String,SyntaxError,TypeError,

URIError

53.JS中的换行:

\n

54.窗口全屏大小:

56.JS中的焦点顺序:

document.getElementByid（"表单元素"）.tabIndex=1

57.innerHTML的值是表单元素的值:

如"howareyou"

howareyou

58.innerTEXT的值和上面的一样,只不过不会把这种标记显示出来.

59.contentEditable可设置元素是否可被修改,isContentEditable返回是否可修改的状态.

60.isDisabled判断是否为禁止状态.disabled设置禁止状态

61.length取得长度,返回整型数值

62.addBehavior（）是一种JS调用的外部函数文件其扩展名为.htc

63.window.focus（）使当前的窗口在所有窗口之前.

64.blur（）指失去焦点.与FOCUS（）相反.

65.select（）指元素为选中状态.

66.防止用户对文本框中输入文本:

onfocus="this.blur（）"

67.取出该元素在页面中出现的数量:

document.all.tags（"div（或其它HTML标记符）"）.length

68.JS中分为两种窗体输出:

模态和非模态.window.showModaldialog（）,window.showModeless（）

69.状态栏文字的设置:

window.status='文字',默认的状态栏文字设置:

window.defaultStatus='文字.';

71.JS中遇到脚本错误时不做任何操作:

window.onerror=doNothing;指定错误句柄的语法为:

window.onerror=handleError;

72.JS中指定当前打开窗口的父窗口:

window.opener,支持opener.opener...的多重继续.

73.JS中的self指的是当前的窗口

74.JS中状态栏显示内容:

window.status="内容"

75.JS中的top指的是框架集中最顶层的框架

76.JS中关闭当前的窗口:

window.close（）;

77.JS中提出是否确认的框:

if（confirm（"Areyousure?

"））{alert（"ok"）;}else{alert（"NotOk"）;}

78.JS中的窗口重定向:

window.navigate（""/;）;

79.JS中的打印:

window.print（）

80.JS中的提示输入框:

window.prompt（"message","defaultReply"）;

四、JavaScript在html页面中实例

1.菜单设计示例