宋尚平　李興保

摘要介紹NET技術(shù)的網(wǎng)上學(xué)習(xí)系統(tǒng)的設(shè)計與開發(fā)，在分析其內(nèi)涵、功能模塊、優(yōu)勢的基礎(chǔ)上，簡要介紹了主要文件及其代碼的實現(xiàn)。

關(guān)鍵字ASP.NET; 網(wǎng)上學(xué)習(xí)系統(tǒng); 設(shè)計；開發(fā)

中圖分類號TP393文件標(biāo)識碼：A 文章編號：1671-489X（2007）02－0059-04

Design and Development based on Net Technology Learning System//Li Xingbao, Song Shangping

Abstract On the bases of analyzing the connotation, function module and the advantage, the paper introduces the realization of main documents and code.

Key words active server page.net(ASP.NET); web learning system; design; development

Author's address Information Technology & Media, Qufu Normal University, Rizhao, Shangdong 276826

隨著信息化社會的高速發(fā)展，越來越多的學(xué)習(xí)內(nèi)容出現(xiàn)在計算機(jī)網(wǎng)絡(luò)當(dāng)中。在教育教學(xué)當(dāng)中，如何使學(xué)生了解和使用這些知識呢？基于此問題，我們設(shè)計了網(wǎng)上學(xué)習(xí)系統(tǒng), 以便學(xué)生能夠充分利用各種計算機(jī)網(wǎng)絡(luò)信息，加強(qiáng)學(xué)生的自學(xué)能力，無論對學(xué)生還是教師都是大有益處的。

筆者所采用的是ASP.NET語言、SQL Server2000數(shù)據(jù)庫、Dreamweaver和UltraEdit等開發(fā)工具； ASP.NET開發(fā)平臺:操作系統(tǒng)采用Windows 2000 Server;Web服務(wù)器采用IIS5.1以及 NET Framework SDK 2005、 Internet Explorer 6。

1 學(xué)習(xí)系統(tǒng)的涵義及優(yōu)勢

1.1學(xué)習(xí)系統(tǒng)的涵義

關(guān)于網(wǎng)上學(xué)習(xí)系統(tǒng)的定義，沒有一個固定的說法。筆者認(rèn)為網(wǎng)上學(xué)習(xí)系統(tǒng)的涵義是：以計算機(jī)網(wǎng)絡(luò)為基礎(chǔ)，由專業(yè)人員設(shè)計的能夠利用網(wǎng)絡(luò)上的各種知識信息，并把這些信息篩選之后供學(xué)習(xí)者自行選擇學(xué)習(xí)的軟件系統(tǒng)。基于NET技術(shù)的網(wǎng)上學(xué)習(xí)系統(tǒng)就是以ASP.NET作為技術(shù)支撐構(gòu)建的網(wǎng)上學(xué)習(xí)系統(tǒng)。

1.2學(xué)習(xí)系統(tǒng)的優(yōu)勢

基于ASP.NET技術(shù)的網(wǎng)上學(xué)習(xí)系統(tǒng)的優(yōu)勢主要體現(xiàn)在以下幾個方面：

1）代碼不僅更容易編寫，而且更加干凈整潔，更易于閱讀。同時，ASP.NET代碼的結(jié)構(gòu)方式提高了系統(tǒng)的再利用性和共享性。

2）改進(jìn)了系統(tǒng)的配置、伸縮性、安全性和可靠性。

3）對各種不同的瀏覽器提供了更好的支持。

4）ASP.NET 造就了一類新的Web應(yīng)用程序，使系統(tǒng)動態(tài)性和伸縮性更好。

2 系統(tǒng)功能描述及功能模塊的劃分

2.1系統(tǒng)功能描述

網(wǎng)上學(xué)習(xí)系統(tǒng)的主要功能包括用戶登陸管理、學(xué)習(xí)內(nèi)容分類管理、學(xué)習(xí)內(nèi)容發(fā)布管理、學(xué)習(xí)內(nèi)容更新、刪除管理、學(xué)習(xí)內(nèi)容查詢管理、學(xué)習(xí)內(nèi)容瀏覽等幾大模塊。具體描述如下“

1）用戶登陸管理

2）學(xué)習(xí)內(nèi)容分類管理

學(xué)習(xí)內(nèi)容類別的增加，包括類別的名稱和類別編號；學(xué)習(xí)內(nèi)容類別信息的修改；學(xué)習(xí)內(nèi)容類別的刪除。

3）學(xué)習(xí)內(nèi)容發(fā)布管理

學(xué)習(xí)內(nèi)容基本信息的發(fā)布；其他資料上傳功能。

4）學(xué)習(xí)內(nèi)容更新、刪除管理

學(xué)習(xí)內(nèi)容信息更改；學(xué)習(xí)內(nèi)容的刪除。

5）學(xué)習(xí)內(nèi)容查詢管理

學(xué)習(xí)內(nèi)容分類信息列表；學(xué)習(xí)內(nèi)容檢索。

6）學(xué)習(xí)內(nèi)容瀏覽

學(xué)習(xí)內(nèi)容詳細(xì)信息瀏覽和學(xué)習(xí)內(nèi)容評論瀏覽；發(fā)表學(xué)習(xí)內(nèi)容評論；分類學(xué)習(xí)內(nèi)容列表。

2.2 功能模塊的劃分

根據(jù)以上的系統(tǒng)功能描述，設(shè)計功能模塊圖，如圖1所示。

圖1 功能模塊圖

經(jīng)過分析，系統(tǒng)的參與人員有2種：匿名用戶和管理員。匿名用戶作為系統(tǒng)的普通用戶，這里我們不需要特定的用戶名，所以不需要進(jìn)行系統(tǒng)的身份驗證。普通用戶通過頁面查詢出所需要的學(xué)習(xí)內(nèi)容，進(jìn)行學(xué)習(xí)內(nèi)容詳細(xì)信息的瀏覽和發(fā)表自己對學(xué)習(xí)內(nèi)容的評論。管理員具有管理該系統(tǒng)的權(quán)限，可以進(jìn)入后臺管理系統(tǒng)進(jìn)行學(xué)習(xí)內(nèi)容信息的管理。

3 主要文件代碼

由于用戶登陸等這些模塊的實現(xiàn)比較簡單，這里不作介紹。主要敘述以下2個主要功能模塊，當(dāng)然也是開發(fā)過程中最難實現(xiàn)的。

３．１Ｃｏｎｔｅｎｔ．ａｓｐｘ的設(shè)計與編碼

Ｃｏｎｔｅｎｔ．ａｓｐｘ提供了兩個功能：

１）按照參數(shù)列出該類別的學(xué)習(xí)內(nèi)容列表。

２）按照參數(shù)檢索出符合條件的學(xué)習(xí)內(nèi)容列表。

Ｃｏｎｔｅｎｔ．ａｓｐｘ的ＨＴＭＬ代碼如下：

＜％＠ＰａｇｅＬａｎｇｕａｇｅ＝＂ｖｂ＂ＡｕｔｏＥｖｅｎｔＷｉｒｅｕｐ＝＂ｆａｌｓｅ＂Ｃｏｄｅｂｅｈｉｎｄ＝＂Ｃｏｎｔｅｎｔ．ａｓｐｘ．ｖｂ＂Ｉｎｈｅｒｉｔｓ＝＂ＴｈｅＣｏｎｔｅｎｔＹＳ．Ｃｏｎｔｅｎｔ＂％＞

＜?。模希茫裕伲校牛龋裕停蹋校眨拢蹋桑茫ⅲ祝常茫模裕模龋裕停蹋矗埃裕颍幔睿螅椋簦椋铮睿幔欤牛危ⅲ?/p>

＜ＨＴＭＬ＞

＜ＨＥＡＤ＞

＜ｍｅｔａｎａｍｅ＝＂ｖｓ＿ｓｎａｐＴｏＧｒｉｄ＂ｃｏｎｔｅｎｔ＝＂Ｆａｌｓｅ＂＞

＜ｔｉｔｌｅ＞Ｃｏｎｔｅｎｔ＜／ｔｉｔｌｅ＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＭｉｃｒｏｓｏｆｔＶｉｓｕａｌＳｔｕｄｉｏ．ＮＥＴ＂ｎａｍｅ＝＂ＧＥＮＥＲＡＴＯＲ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＶｉｓｕａｌＢａｓｉｃ．ＮＥＴ＂ｎａｍｅ＝＂ＣＯＤＥ＿ＬＡＮＧＵＡＧＥ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＪａｖａＳｃｒｉｐｔ＂ｎａｍｅ＝＂ｖｓ＿ｄｅｆａｕｌｔＣｌｉｅｎｔＳｃｒｉｐｔ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ｈｔｔｐ：／／ｓｃｈｅｍａｓ．ｍｉｃｒｏｓｏｆｔ．ｃｏｍ／ｉｎｔｅｌｌｉｓｅｎｓｅ／ｉｅ６＂ｎａｍｅ＝＂ｖｓ＿ｔａｒｇｅｔＳｃｈｅｍａ＂＞

＜／ＨＥＡＤ＞

＜ｂｏｄｙＭＳ＿ＰＯＳＩＴＩＯＮＩＮＧ＝＂ＧｒｉｄＬａｙｏｕｔ＂＞

＜ｆｏｒｍｉｄ＝＂Ｆｏｒｍ１＂ｍｅｔｈｏｄ＝＂ｐｏｓｔ＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞

＜ｃｅｎｔｅｒ＞

＜ＴＡＢＬＥｉｄ＝＂Ｔａｂｌｅ１＂ｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃ｄｄ１１２２２ｐｘｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃ｄｄ１１２２２ｐｘｓｏｌｉｄ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃ｄｄ１１２２２ｐｘｓｏｌｉｄ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃ｄｄ１１２２２ｐｘｓｏｌｉｄ＂

ｃｅｌｌＳｐａｃｉｎｇ＝＂０＂ｃｅｌｌＰａｄｄｉｎｇ＝＂０＂ｗｉｄｔｈ＝＂６００＂ｂｏｒｄｅｒ＝＂０＂＞

＜ＴＲ＞

＜ＴＤ＞＜ＩＭＧｓｒｃ＝＂ｈｔｔｐ：／／１２７．０．０．１／／ｘｉｎｃｈｕａｎ／ｎｅｔ／／１．ｊｐｇ＂＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞＜ＦＯＮＴｆａｃｅ＝＂宋體＂＞＜／ＦＯＮＴ＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞

＜ＴＡＢＬＥｉｄ＝＂Ｔａｂｌｅ２＂ｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃００４２００１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃００４２００１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃００４２００１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃００４２００１ｐｔｓｏｌｉｄ＂

ｃｅｌｌＳｐａｃｉｎｇ＝＂０＂ｃｅｌｌＰａｄｄｉｎｇ＝＂０＂ｗｉｄｔｈ＝＂６００＂ｂｏｒｄｅｒ＝＂０＂＞

＜ａｓｐ：ｄａｔａｌｉｓｔｉｄ＝＂Ｌｉｓｔ１＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂ＢｏｒｄｅｒＣｏｌｏｒ＝＂＃ｄｄ１１２２＂ＢｏｒｄｅｒＷｉｄｔｈ＝＂２ｐｔ＂＞

＜ＡｌｔｅｒｎａｔｉｎｇＩｔｅｍＳｔｙｌｅＢａｃｋＣｏｌｏｒ＝＂Ａｚｕｒｅ＂＞＜／ＡｌｔｅｒｎａｔｉｎｇＩｔｅｍＳｔｙｌｅ＞

＜ＨｅａｄｅｒＳｔｙｌｅＦｏｎｔ－Ｓｉｚｅ＝＂Ｌａｒｇｅｒ＂Ｆｏｎｔ－Ｂｏｌｄ＝＂Ｔｒｕｅ＂ＦｏｒｅＣｏｌｏｒ＝＂Ａｚｕｒｅ＂ＢａｃｋＣｏｌｏｒ＝＂＃ｄｄ１１２２＂＞＜／ＨｅａｄｅｒＳｔｙｌｅ＞

＜ＩｔｅｍＴｅｍｐｌａｔｅ＞

＜ｔｒ＞

＜ＴＤａｌｉｇｎ＝＂ｌｅｆｔ＂ｓｔｙｌｅ＝＂ＦＯＮＴ－ＷＥＩＧＨＴ：ｂｏｌｄ；ＦＯＮＴ－ＳＩＺＥ：１３ｐｔ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ｄａｒｋｇｒａｙ＂＞標(biāo)題：

＜ａｈｒｅｆ＝＇＜％＃＂ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ？ａｉｄ＝＂＆ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｉｄ＂）％＞＇ｔａｒｇｅｔ＝＿ｂｌａｎｋ＞

＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｔｉｔｌｅ＂）％＞

＜／ａ＞

＜／ＴＤ＞

＜／ｔｒ＞

＜ｔｒ＞

＜ＴＤａｌｉｇｎ＝＂ｌｅｆｔ＂ｓｔｙｌｅ＝＂ＦＯＮＴ－ＳＩＺＥ：１１ｐｔ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ｌｉｇｈｔｇｒｅｙ＂＞

ｉｄ：＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｉｄ＂）％＞

作者：＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｗｒｉｔｅｒ＂）％＞

時間：＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｔｉｍｅ＂）％＞

學(xué)習(xí)次數(shù)：＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｃｉｓｈｕ＂）％＞

＜／ＴＤ＞

＜／ｔｒ＞

＜ｔｒ＞

＜ＴＤａｌｉｇｎ＝＂ｌｅｆｔ＂ｓｔｙｌｅ＝＂ＦＯＮＴ－ＳＩＺＥ：１１ｐｔ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ｌｉｇｈｔｇｒｅｙ＂＞關(guān)鍵字［＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｋｗ＂）％＞］＜／ＴＤ＞

＜／ｔｒ＞

＜ｔｒ＞

＜ＴＤａｌｉｇｎ＝＂ｌｅｆｔ＂ｓｔｙｌｅ＝＂ＴＥＸＴ－ＩＮＤＥＮＴ：１１ｐｔ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ｓｅａｓｈｅｌｌ＂＞

學(xué)習(xí)摘要：＜ｂｒ＞

．．．＜％＃ｍｉｄ（ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｃｏｎｔｅｎｔ＂），５０，２００）％＞．．．＜ｂｒ＞

＜／ＴＤ＞

＜／ｔｒ＞

＜／ＩｔｅｍＴｅｍｐｌａｔｅ＞

＜／ａｓｐ：ｄａｔａｌｉｓｔ＞＜／ＴＡＢＬＥ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞＜ａｓｐ：ｌａｂｅｌｉｄ＝＂Ｌａｂｅｌ１＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞＜／ａｓｐ：ｌａｂｅｌ＞＜ａｓｐ：ｌｉｎｋｂｕｔｔｏｎｉｄ＝＂ＬｉｎｋＢｕｔｔｏｎ４＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞第一頁＜／ａｓｐ：ｌｉｎｋｂｕｔｔｏｎ＞

＜ａｓｐ：ｌｉｎｋｂｕｔｔｏｎｉｄ＝＂ＬｉｎｋＢｕｔｔｏｎ１＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞上頁＜／ａｓｐ：ｌｉｎｋｂｕｔｔｏｎ＞＜ａｓｐ：ｌｉｎｋｂｕｔｔｏｎｉｄ＝＂ＬｉｎｋＢｕｔｔｏｎ２＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞下頁＜／ａｓｐ：ｌｉｎｋｂｕｔｔｏｎ＞

＜ａｓｐ：ｌｉｎｋｂｕｔｔｏｎｉｄ＝＂ＬｉｎｋＢｕｔｔｏｎ３＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞末頁＜／ａｓｐ：ｌｉｎｋｂｕｔｔｏｎ＞＜／ＦＯＮＴ＞＜／ＴＤ＞

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜／ｃｅｎｔｅｒ＞

＜／ｆｏｒｍ＞

＜／ｂｏｄｙ＞

＜／ＨＴＭＬ＞

３．２ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ的設(shè)計與編碼

ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ是具體顯示學(xué)習(xí)內(nèi)容的頁面，按照傳入的ＩＤ，從數(shù)據(jù)庫中檢索出學(xué)習(xí)內(nèi)容，并把內(nèi)容顯示出來。

ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ的ＨＴＭＬ代碼如下：

＜％＠ＰａｇｅＬａｎｇｕａｇｅ＝＂ｖｂ＂ＡｕｔｏＥｖｅｎｔＷｉｒｅｕｐ＝＂ｆａｌｓｅ＂Ｃｏｄｅｂｅｈｉｎｄ＝＂ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ．ｖｂ＂Ｉｎｈｅｒｉｔｓ＝＂ＴｈｅＣｏｎｔｅｎｔＹＳ．ＴｈｅＣｏｎｔｅｎｔ＂％＞

＜％＠ＲｅｇｉｓｔｅｒＴａｇＰｒｅｆｉｘ＝＂ｕｃ１＂ＴａｇＮａｍｅ＝＂ｔｅａｌｋｅｒ＂Ｓｒｃ＝＂ｔｅａｌｋｅｒ．ａｓｃｘ＂％＞

＜?。模希茫裕伲校牛龋裕停蹋校眨拢蹋桑茫ⅲ祝常茫模裕模龋裕停蹋矗埃裕颍幔睿螅椋簦椋铮睿幔欤牛危ⅲ?/p>

＜ＨＴＭＬ＞

＜ＨＥＡＤ＞

＜ｔｉｔｌｅｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂ｉｄ＝＂Ｍｙｔｉｔｌｅ＂＞＜／ｔｉｔｌｅ＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＭｉｃｒｏｓｏｆｔＶｉｓｕａｌＳｔｕｄｉｏ．ＮＥＴ＂ｎａｍｅ＝＂ＧＥＮＥＲＡＴＯＲ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＶｉｓｕａｌＢａｓｉｃ．ＮＥＴ＂ｎａｍｅ＝＂ＣＯＤＥ＿ＬＡＮＧＵＡＧＥ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ＪａｖａＳｃｒｉｐｔ＂ｎａｍｅ＝＂ｖｓ＿ｄｅｆａｕｌｔＣｌｉｅｎｔＳｃｒｉｐｔ＂＞

＜ｍｅｔａｃｏｎｔｅｎｔ＝＂ｈｔｔｐ：／／ｓｃｈｅｍａｓ．ｍｉｃｒｏｓｏｆｔ．ｃｏｍ／ｉｎｔｅｌｌｉｓｅｎｓｅ／ｉｅ６＂ｎａｍｅ＝＂ｖｓ＿ｔａｒｇｅｔＳｃｈｅｍａ＂＞

＜／ＨＥＡＤ＞

＜ｂｏｄｙＭＳ＿ＰＯＳＩＴＩＯＮＩＮＧ＝＂ＧｒｉｄＬａｙｏｕｔ＂＞

＜ｆｏｒｍｉｄ＝＂Ｆｏｒｍ１＂ｍｅｔｈｏｄ＝＂ｐｏｓｔ＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞

＜ｃｅｎｔｅｒ＞

＜ＴＡＢＬＥｉｄ＝＂Ｔａｂｌｅ１＂ｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ＂

ｃｅｌｌＳｐａｃｉｎｇ＝＂０＂ｃｅｌｌＰａｄｄｉｎｇ＝＂０＂ｗｉｄｔｈ＝＂６００＂ｂａｃｋｇｒｏｕｎｄ＝＂ｉｍａｇｅｓ／ｂｇ１．ｇｉｆ＂ｂｏｒｄｅｒ＝＂０＂＞

＜ＴＲ＞

＜ＴＤ＞＜／ＴＤ＞

＜ＴＤａｌｉｇｎ＝＂ｒｉｇｈｔ＂＞

＜ＴＡＢＬＥｉｄ＝＂Ｔａｂｌｅ２＂ｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＷＩＤＴＨ：６００ｐｘ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＨＥＩＧＨＴ：５０ｐｘ＂

ｃｅｌｌＳｐａｃｉｎｇ＝＂０＂ｃｅｌｌＰａｄｄｉｎｇ＝＂０＂ｗｉｄｔｈ＝＂６００＂ｂｏｒｄｅｒ＝＂０＂＞

＜ＴＲ＞

＜ＴＤｓｔｙｌｅ＝＂ＦＯＮＴ－ＷＥＩＧＨＴ：ｂｏｌｄ；ＦＯＮＴ－ＳＩＺＥ：１４ｐｔ；ＣＯＬＯＲ：ｗｈｉｔｅ；ＨＥＩＧＨＴ：５０ｐｘ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：＃４２６１ａｃ＂

ａｌｉｇｎ＝＂ｃｅｎｔｅｒ＂＞＜ａｓｐ：ｌａｂｅｌｉｄ＝＂Ｌａｂｅｌ１＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞Ｌａｂｅｌ＜／ａｓｐ：ｌａｂｅｌ＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＦＯＮＴ－ＳＩＺＥ：１０ｐｔ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＨＥＩＧＨＴ：３０ｐｘ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ａｚｕｒｅ＂

ａｌｉｇｎ＝＂ｃｅｎｔｅｒ＂＞＜ａｓｐ：ｌａｂｅｌｉｄ＝＂Ｌａｂｅｌ２＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞Ｌａｂｅｌ＜／ａｓｐ：ｌａｂｅｌ＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＲＩＧＨＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＴＯＰ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＦＯＮＴ－ＳＩＺＥ：１０ｐｔ；ＢＯＲＤＥＲ－ＬＥＦＴ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃４２６１ａｃ１ｐｔｓｏｌｉｄ；ＨＥＩＧＨＴ：３０ｐｘ；ＢＡＣＫＧＲＯＵＮＤ－ＣＯＬＯＲ：ａｚｕｒｅ＂

ａｌｉｇｎ＝＂ｃｅｎｔｅｒ＂＞＜ａｓｐ：ｌａｂｅｌｉｄ＝＂Ｌａｂｅｌ４＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞Ｌａｂｅｌ＜／ａｓｐ：ｌａｂｅｌ＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤｓｔｙｌｅ＝＂ＦＯＮＴ－ＳＩＺＥ：１１ｐｔ；ＬＩＮＥ－ＨＥＩＧＨＴ：２０ｐｔ＂＞＜ａｓｐ：ｌａｂｅｌｉｄ＝＂Ｌａｂｅｌ３＂ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂＞Ｌａｂｅｌ＜／ａｓｐ：ｌａｂｅｌ＞＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤｓｔｙｌｅ＝＂ＢＯＲＤＥＲ－ＢＯＴＴＯＭ：＃ｄｄ１１２２ｔｈｉｎｓｏｌｉｄ＂＞＜ｂｒ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞＜ｂｒ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤａｌｉｇｎ＝＂ｃｅｎｔｅｒ＂＞＜ｕｃ１：ｔｅａｌｋｅｒｉｄ＝Ｔｅａｌｋｅｒ１ｒｕｎａｔ＝＂ｓｅｒｖｅｒ＂ａｉｄ＝＇＜％＃Ｒｅｑｕｅｓｔ．Ｐａｒａｍｓ（＂ａｉｄ＂）％＞＇＞＜／ｕｃ１：ｔｅａｌｋｅｒ＞＜／ＴＤ＞

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜Ｐ＞＜／Ｐ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜／ｃｅｎｔｅｒ＞

＜／ｆｏｒｍ＞

＜／ｂｏｄｙ＞

＜／ＨＴＭＬ＞

以上就是２個主要文件的前臺代碼，盡管它的實現(xiàn)不是特別復(fù)雜，但是筆者卻希望它能夠起到拋磚引玉的作用，使大家能夠了解并使用它。

４結(jié)束語

本系統(tǒng)有很高的應(yīng)用價值，特別是在教育教學(xué)領(lǐng)域具有極其廣闊的應(yīng)用前景，當(dāng)然這系統(tǒng)將會在實踐中不斷的完善，以滿足網(wǎng)絡(luò)信息的不斷發(fā)展以及用戶的需求。只有這樣，網(wǎng)上學(xué)習(xí)系統(tǒng)才能發(fā)揮出更大的作用。