基于ＮＥＴ技術的網上學習系統的設計與開發

宋尚平　李興保

摘要介紹NET技術的網上學習系統的設計與開發，在分析其內涵、功能模塊、優勢的基礎上，簡要介紹了主要文件及其代碼的實現。

關鍵字ASP.NET; 網上學習系統; 設計；開發

中圖分類號TP393文件標識碼：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

隨著信息化社會的高速發展，越來越多的學習內容出現在計算機網絡當中。在教育教學當中，如何使學生了解和使用這些知識呢？基于此問題，我們設計了網上學習系統, 以便學生能夠充分利用各種計算機網絡信息，加強學生的自學能力，無論對學生還是教師都是大有益處的。

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

1 學習系統的涵義及優勢

1.1學習系統的涵義

關于網上學習系統的定義，沒有一個固定的說法。筆者認為網上學習系統的涵義是：以計算機網絡為基礎，由專業人員設計的能夠利用網絡上的各種知識信息，并把這些信息篩選之后供學習者自行選擇學習的軟件系統。基于NET技術的網上學習系統就是以ASP.NET作為技術支撐構建的網上學習系統。

1.2學習系統的優勢

基于ASP.NET技術的網上學習系統的優勢主要體現在以下幾個方面：

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

2）改進了系統的配置、伸縮性、安全性和可靠性。

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

4）ASP.NET 造就了一類新的Web應用程序，使系統動態性和伸縮性更好。

2 系統功能描述及功能模塊的劃分

2.1系統功能描述

網上學習系統的主要功能包括用戶登陸管理、學習內容分類管理、學習內容發布管理、學習內容更新、刪除管理、學習內容查詢管理、學習內容瀏覽等幾大模塊。具體描述如下“

1）用戶登陸管理

2）學習內容分類管理

學習內容類別的增加，包括類別的名稱和類別編號；學習內容類別信息的修改；學習內容類別的刪除。

3）學習內容發布管理

學習內容基本信息的發布；其他資料上傳功能。

4）學習內容更新、刪除管理

學習內容信息更改；學習內容的刪除。

5）學習內容查詢管理

學習內容分類信息列表；學習內容檢索。

6）學習內容瀏覽

學習內容詳細信息瀏覽和學習內容評論瀏覽；發表學習內容評論；分類學習內容列表。

2.2 功能模塊的劃分

根據以上的系統功能描述，設計功能模塊圖，如圖1所示。

圖1 功能模塊圖

經過分析，系統的參與人員有2種：匿名用戶和管理員。匿名用戶作為系統的普通用戶，這里我們不需要特定的用戶名，所以不需要進行系統的身份驗證。普通用戶通過頁面查詢出所需要的學習內容，進行學習內容詳細信息的瀏覽和發表自己對學習內容的評論。管理員具有管理該系統的權限，可以進入后臺管理系統進行學習內容信息的管理。

3 主要文件代碼

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

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

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

１）按照參數列出該類別的學習內容列表。

２）按照參數檢索出符合條件的學習內容列表。

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

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

＜！ＤＯＣＴＹＰＥＨＴＭＬＰＵＢＬＩＣ＂－／／Ｗ３Ｃ／／ＤＴＤＨＴＭＬ４．０Ｔｒａｎｓｉｔｉｏｎａｌ／／ＥＮ＂＞

＜ＨＴＭＬ＞

＜ＨＥＡＤ＞

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

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

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

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

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

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

＜／ＨＥＡＤ＞

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

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

＜ｃｅｎｔｅｒ＞

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

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

＜ＴＲ＞

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

＜／ＴＲ＞

＜ＴＲ＞

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

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞

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

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

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

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

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

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

＜ｔｒ＞

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

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

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

＜／ａ＞

＜／ＴＤ＞

＜／ｔｒ＞

＜ｔｒ＞

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

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

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

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

學習次數：＜％＃ｄａｔａｂｉｎｄｅｒ．ｅｖａｌ（ｃｏｎｔａｉｎｅｒ．ｄａｔａｉｔｅｍ，＂ｃｉｓｈｕ＂）％＞

＜／ＴＤ＞

＜／ｔｒ＞

＜ｔｒ＞

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

＜／ｔｒ＞

＜ｔｒ＞

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

學習摘要：＜ｂｒ＞

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

＜／ＴＤ＞

＜／ｔｒ＞

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

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

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

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

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

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

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜／ｃｅｎｔｅｒ＞

＜／ｆｏｒｍ＞

＜／ｂｏｄｙ＞

＜／ＨＴＭＬ＞

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

ＴｈｅＣｏｎｔｅｎｔ．ａｓｐｘ是具體顯示學習內容的頁面，按照傳入的ＩＤ，從數據庫中檢索出學習內容，并把內容顯示出來。

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

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

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

＜！ＤＯＣＴＹＰＥＨＴＭＬＰＵＢＬＩＣ＂－／／Ｗ３Ｃ／／ＤＴＤＨＴＭＬ４．０Ｔｒａｎｓｉｔｉｏｎａｌ／／ＥＮ＂＞

＜ＨＴＭＬ＞

＜ＨＥＡＤ＞

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

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

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

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

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

＜／ＨＥＡＤ＞

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

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

＜ｃｅｎｔｅｒ＞

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

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

＜ＴＲ＞

＜ＴＤ＞＜／ＴＤ＞

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

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

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

＜ＴＲ＞

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

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

＜／ＴＲ＞

＜ＴＲ＞

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

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

＜／ＴＲ＞

＜ＴＲ＞

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

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

＜／ＴＲ＞

＜ＴＲ＞

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

＜／ＴＲ＞

＜ＴＲ＞

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

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

＜ＴＤ＞＜ｂｒ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜ＴＲ＞

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

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜Ｐ＞＜／Ｐ＞

＜／ＴＤ＞

＜／ＴＲ＞

＜／ＴＡＢＬＥ＞

＜／ｃｅｎｔｅｒ＞

＜／ｆｏｒｍ＞

＜／ｂｏｄｙ＞

＜／ＨＴＭＬ＞

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

４結束語

本系統有很高的應用價值，特別是在教育教學領域具有極其廣闊的應用前景，當然這系統將會在實踐中不斷的完善，以滿足網絡信息的不斷發展以及用戶的需求。只有這樣，網上學習系統才能發揮出更大的作用。