1 / 12

網頁設計回顧

網頁設計回顧. ASP.NET. ASP. HTML. 網頁的發展史. 網頁發展史大致可以分成下面三個階段： HTML (HyperText Markup Language) ASP (Active Server Page) ASP.NET 其他較知名的網頁程式 : JSP PHP. HTML. 以標籤組成整份文件 主要用來呈現網頁畫面與排版 HTML 的標籤要 成對 出現：. 1. <html> 2. <body> 3. <center>

leo-love
Download Presentation

網頁設計回顧

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 網頁設計回顧

  2. ASP.NET ASP HTML 網頁的發展史 • 網頁發展史大致可以分成下面三個階段： • HTML (HyperText Markup Language) • ASP (Active Server Page) • ASP.NET • 其他較知名的網頁程式: • JSP • PHP

  3. HTML • 以標籤組成整份文件 • 主要用來呈現網頁畫面與排版 • HTML的標籤要成對出現： • 1. <html> • 2. <body> • 3. <center> • 4. <fontface="標楷體">Hi, 你好</font> • 5. </center> • 6. </body> • </html> • 圖1.1. WebPage0101.html Hi, 你好 圖1.2 瀏覽WebPage0101.html

  4. 常用的HTML標籤(1/2)

  5. 常用的HTML標籤(2/2)

  6. 圖1.4 瀏覽WebPage0102.html ASP • 最原始的HTML語言缺乏和使用者互動的功能，於是有ASP的出現 • 1. <html> • 2. <body> • 3. <form action="WebPage0103.asp"> • 4. 請輸入姓名:<input type="text" size="8" name="inName"><br> • 5. <input type="submit" value="傳送"> • 6. </form> • 7. </body> • </html> • 圖1.3. WebPage0102.html

  7. 簡介ASP • 1. <html> • 2. <body> • 3. <form action="WebPage0103.asp"> • 4. 請輸入姓名:<input type="text" size="8" name="inName"><br> • 5. <input type="submit" value="傳送"> • 6. </form> • 7. </body> • </html> • 圖1.3. WebPage0102.html 1. <% 2. Response.Write("Hi," + Request("inName") + "你好") 3. %> 圖1.7 WebPage0103.asp.

  8. 圖1.5 瀏覽WebPage0102.html 圖1.4 瀏覽WebPage0102.html 圖1.6 上圖輸出之結果. 簡介ASP

  9. ASP的缺點 • 一件工作要多個程式來完成 • 不是全盤物件導向化的程式語言 • 未做輸入資料資驗證 • 未做網頁的資訊安全 • 未支援XML

  10. ASP.NET • ASP.NET改進了ASP的缺點，將網頁程式帶進一個嶄新的境界，ASP.NET的程式包含下列四大部分： • 指引區塊(directive block): • 夾在標籤“<%@ … %>”之中。 • .NET程式碼區塊(code declaration block): • 夾在標籤"<script … >"和"</script>"之中。 • 網頁標籤區塊(tag block): • 夾在標籤"<html>"和"</html>"之中。 • 動態標籤區塊(code render block): • 夾在標籤"<% … %>"之中。

  11. ASP.NET 指引區塊 <%@ Page Language="VB" %> <script runat="server"> sub SayHi(obj as Object, e as EventArgs) lblMessage.Text = "Hi, " + tbName.Text + "你好“ end sub </script> .NET程式碼區塊 <html> <head></head> <body> <% Response.write("第一個ASP.NET程式") %> <br> <asp:Label id="lblMessage" runat="server" Text="看過來"/><br> <form runat="server"> 請輸入姓名:<asp:TextBox id="tbName" runat="server" /><br> <asp:Button Text="傳送" OnClick="SayHi" Runat="server" /> </form> </body> </html> 網 頁標籤區 塊 動態標籤區塊 圖1.8 WebPage0104.aspx

  12. ASP.NET程式的編譯 • .NET程式碼區塊和動態標籤區塊所用的語言都是script語言，但是執行時機卻不同。當用瀏覽器瀏覽網頁程式時，ASP.NET先編譯網頁程式，其中 • .NET程式碼區塊，就會被編譯成object code，謂之Microsoft Intermediate Language碼，簡稱MSIL碼，此MSIL碼是儲存在server中，只是要讓網頁程式能快速的被執行。 • 編譯程式對網頁標籤區塊的處理是將所有的標籤都轉換成HTML的標籤，如果原來就是HTML的標籤，則不會有變化，若是ASP.NET的標籤，就要轉換成HTML的標籤。 • 編譯程式對動態標籤區塊中的程式碼不是做compile，而是做interpret的動作，亦即動態標籤區塊中的程式碼立即被解譯成HTML的標籤，和轉換後的網頁標籤區塊一起傳送到client端的瀏覽器。

More Related