《太原理工大學(xué)web程序設(shè)計(jì)基礎(chǔ)實(shí)驗(yàn)報(bào)告.doc》由會(huì)員分享，可在線閱讀，更多相關(guān)《太原理工大學(xué)web程序設(shè)計(jì)基礎(chǔ)實(shí)驗(yàn)報(bào)告.doc（24頁(yè)珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。

課程名稱(chēng)： WEB程序設(shè)計(jì)基礎(chǔ) 實(shí)驗(yàn)項(xiàng)目： WEB程序設(shè)計(jì)基礎(chǔ)實(shí)驗(yàn) 實(shí)驗(yàn)地點(diǎn)： 逸夫樓402 專(zhuān)業(yè)班級(jí)： 軟件1415班 學(xué)生姓名： 朱偉 學(xué)號(hào)： 2014005960 指導(dǎo)教師： 田玉玲 2016年 11 月 21 日 實(shí)驗(yàn)一 HTML語(yǔ)言 一、實(shí)驗(yàn)?zāi)康? 1．掌握常用的HTML語(yǔ)言標(biāo)記； 2．利用文本編輯器建立HTML文檔，制作簡(jiǎn)單網(wǎng)頁(yè)。 二、實(shí)驗(yàn)要求 1．獨(dú)立完成實(shí)驗(yàn)。 2．書(shū)寫(xiě)實(shí)驗(yàn)報(bào)告書(shū)。 三、實(shí)驗(yàn)內(nèi)容 1．在文本編輯器“記事本”中輸入如下的HTML代碼程序，以文件名sy1.html保存，并在瀏覽器中運(yùn)行。（請(qǐng)仔細(xì)閱讀下列程序語(yǔ)句，理解每條語(yǔ)句的作用） （1）程序代碼：

welcome to you

---

A simple HTML document

Welcome to theworld of Html

This is a simple HTML document.It is to give you an outline of how to write HTML file and how the markup tags work in theHTMLfile

Following is three chapters

• This is the chapter one
• This is the chapter two
• This is the chapter three

---

Following is items of the chapter two

item	content
item1	font
item2	table
item3	form

---

1

2

3

4

5

6

7

End of the example document

（2）實(shí)驗(yàn)結(jié)果 2． 編寫(xiě)一個(gè)能輸出如圖所示界面的HTML文件。 （1）程序代碼

請(qǐng)留下個(gè)人資料
姓 名:
E-mail:
電 話:
性 別:	女 男
年 齡：	20以下
留言板：
您的愛(ài)好：	運(yùn)動(dòng)
	閱讀
	聽(tīng)音樂(lè)
	旅游

（2） 實(shí)驗(yàn)結(jié)果： 4、 實(shí)驗(yàn)心得： 剛開(kāi)始編寫(xiě)的時(shí)候只是編寫(xiě)了要求的form，但是不如給出的表單那樣整齊，后來(lái)嘗試用了表格，將表格的border屬性改為0，再適當(dāng)加空格 才完成了如圖所示的表單 實(shí)驗(yàn)二 網(wǎng)頁(yè)程序設(shè)計(jì)-JavaScript 一、實(shí)驗(yàn)?zāi)康? 1．掌握J(rèn)avaScript技術(shù),基本掌握J(rèn)avaScript的開(kāi)發(fā)技巧； 2．利用文本編輯器建立JavaScript腳本語(yǔ)言進(jìn)行簡(jiǎn)單編程。 二、實(shí)驗(yàn)要求: 1．根據(jù)以下實(shí)驗(yàn)內(nèi)容書(shū)寫(xiě)實(shí)驗(yàn)準(zhǔn)備報(bào)告。 2．獨(dú)立完成實(shí)驗(yàn)。 三、實(shí)驗(yàn)內(nèi)容 1． 顯示一個(gè)動(dòng)態(tài)的時(shí)鐘 編寫(xiě)程序，在文本框中顯示實(shí)時(shí)的時(shí)間，然后運(yùn)行文件,驗(yàn)證程序是否正確。 （1） 程序代碼

現(xiàn)在是北京時(shí)間：

（2） 實(shí)驗(yàn)結(jié)果 2．事件驅(qū)動(dòng)和事件處理 在文本編輯器“記事本”中輸入如下代碼程序，請(qǐng)仔細(xì)閱讀下列程序語(yǔ)句，理解每條語(yǔ)句的作用。源程序清單如下：

分析上述代碼的作用,然后用瀏覽器運(yùn)行文件,驗(yàn)證自己的判斷是否正確。 3．JavaScript表單校驗(yàn) 編寫(xiě)程序register.htm，做一個(gè)如下圖所示的用戶注冊(cè)界面，要求對(duì)用戶填寫(xiě)的部分進(jìn)行合法性檢驗(yàn)。 （1） 程序代碼

用戶登錄

請(qǐng)輸入用戶名：

請(qǐng)輸入密碼： 

（2） 實(shí)驗(yàn)結(jié)果 4、 實(shí)驗(yàn)心得： 這次的提前將form寫(xiě)成了表格的形式，這樣顯得整齊，javascript編寫(xiě)時(shí)要注意函數(shù)的編寫(xiě)，如在函數(shù)前加上function，還要注意事件、驅(qū)動(dòng)和處理程序，盡可能地減少失誤。 實(shí)驗(yàn)3 Request與Response對(duì)象的應(yīng)用 一、實(shí)驗(yàn)?zāi)康? 1．掌握J(rèn)SP的Request與Response隱式對(duì)象的用法，基本掌握J(rèn)SP的開(kāi)發(fā)技巧。 2．在JDK和Eclipse環(huán)境下，完成下列實(shí)驗(yàn)。 二、實(shí)驗(yàn)要求 1．獨(dú)立完成實(shí)驗(yàn)。 2．書(shū)寫(xiě)實(shí)驗(yàn)報(bào)告書(shū)。 三、實(shí)驗(yàn)內(nèi)容 編寫(xiě)程序?qū)崿F(xiàn)一個(gè)單選小測(cè)試。在test.jsp頁(yè)面顯示問(wèn)題，并將答案提交至answer.jsp進(jìn)行判斷，如果回答正確，則將頁(yè)面轉(zhuǎn)至yes.jsp;否則，轉(zhuǎn)至no.jsp。 （1）程序代碼 test.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

北京奧運(yùn)會(huì)開(kāi)幕日期是：

8月6日 8月8日 8月9日 8月10日

Answer.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%String mydate; mydate=request.getParameter("date"); if(mydate.equals("8")) response.sendRedirect("yes.jsp"); else response.sendRedirect("no.jsp"); %> Yes.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

恭喜您答對(duì)了！

No.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

很抱歉，您答錯(cuò)了!

（2） 實(shí)驗(yàn)結(jié)果 四、實(shí)驗(yàn)心得 本次實(shí)驗(yàn)需要配置環(huán)境變量才能使用，使用request.getParameter來(lái)接收客戶端傳來(lái)的值，用response.sendRedirect重新定位一個(gè)jsp頁(yè)面。另外本次實(shí)驗(yàn)過(guò)程中出現(xiàn)了端口號(hào)被占用的問(wèn)題，通過(guò)查找資料，將Servers->server.xml中的端口號(hào)改為8003才解決問(wèn)題。 實(shí)驗(yàn)4 Application對(duì)象Session對(duì)象 一、實(shí)驗(yàn)?zāi)康? 1．掌握J(rèn)SP的Application對(duì)象Session對(duì)象對(duì)象的用法，基本掌握J(rèn)SP的開(kāi)發(fā)技巧。 2．在JDK和Eclipse環(huán)境下，完成下列實(shí)驗(yàn)。 二、實(shí)驗(yàn)要求: 1．獨(dú)立完成實(shí)驗(yàn) 2．書(shū)寫(xiě)實(shí)驗(yàn)報(bào)告書(shū) 三、實(shí)驗(yàn)內(nèi)容: 1．請(qǐng)仔細(xì)閱讀下列程序語(yǔ)句，理解每條語(yǔ)句的作用。源程序清單如下： <%@ page contentType="text/html;charset=gb2312"%> <% if (application.getAttribute("counter")==null) application.setAttribute("counter","1"); else{ String strnum=null; strnum=application.getAttribute("counter").toString(); int icount=0; icount=Integer.valueOf(strnum).intValue(); icount++; application.setAttribute("counter",Integer.toString(icount)); } %> 您是第<%=application.getAttribute("counter")%>位訪問(wèn)者！ 2． 上述計(jì)數(shù)器當(dāng)進(jìn)行刷新時(shí)也會(huì)自動(dòng)加1，試編寫(xiě)程序count.jsp，實(shí)現(xiàn)防刷新文本計(jì)數(shù)器。 （1） 程序代碼： <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% if (application.getAttribute("counter")==null) application.setAttribute("counter","1"); else{ String strnum=null; strnum=application.getAttribute("counter").toString(); if(session.isNew())//如果是一個(gè)新的會(huì)話 { int icount=0; icount=Integer.valueOf(strnum).intValue(); icount++; application.setAttribute("counter",Integer.toString(icount)); } } %> 您是第<%=application.getAttribute("counter")%>位訪問(wèn)者！ （2）實(shí)驗(yàn)結(jié)果 刷新時(shí)不再增加數(shù)量，只有重新打開(kāi)頁(yè)面才能增加數(shù)量。 3．編寫(xiě)程序register.htm和register.jsp，做一個(gè)用戶注冊(cè)的界面，要求對(duì)用戶填寫(xiě)的部分進(jìn)行合法性檢驗(yàn)，然后提交到register.jsp進(jìn)行注冊(cè)檢驗(yàn)，若用戶名為user開(kāi)頭的，就提示“該用戶名已被注冊(cè)”，若用戶名為admin，就提示“歡迎您，管理員”，否則，就顯示“注冊(cè)成功”。 （1）程序代碼 Register.html

用戶注冊(cè)

請(qǐng)輸入用戶名：
請(qǐng)輸入密碼：
再次輸入密碼：

Register.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%String name; String chr; name=request.getParameter("Name"); if(name.equals("admin")) out.println("歡迎您，管理員"); else if(name.startsWith("User")) out.println("該用戶名已被注冊(cè)"); else out.println("登陸成功"); %> (2) 實(shí)驗(yàn)結(jié)果 4、 實(shí)驗(yàn)心得 通過(guò)本次實(shí)驗(yàn)學(xué)會(huì)了session和application的使用，session對(duì)象在第一個(gè)JSP頁(yè)面被裝載時(shí)自動(dòng)創(chuàng)建，它的作用范圍是所有頁(yè)面，但只能相對(duì)于一個(gè)用戶，它的生命期從訪問(wèn)這個(gè)網(wǎng)站到關(guān)閉瀏覽器為止；application雖然也是作用于所有頁(yè)面，但是是所有用戶共享的，它的生命期是從開(kāi)啟服務(wù)器開(kāi)始直到關(guān)閉服務(wù)器為止。而且這個(gè)實(shí)驗(yàn)是對(duì)之前實(shí)驗(yàn)的一個(gè)綜合，只要細(xì)心，也是比較容易。