一、為什麼要學習Razor? 可以讓伺服器代碼(就是c#和vb)嵌入到網頁中,也就是說這個頁面中包含html代碼和C#(vb)代碼。基於伺服器的代碼可以在網頁傳送給瀏覽器時,創建動態 Web 內容。當一個網頁被請求時,伺服器在返回頁面給瀏覽器之前先執行頁面中的基於伺服器的代碼。通過伺服器的運行,代碼 ...
一、為什麼要學習Razor?
可以讓伺服器代碼(就是c#和vb)嵌入到網頁中,也就是說這個頁面中包含html代碼和C#(vb)代碼。基於伺服器的代碼可以在網頁傳送給瀏覽器時,創建動態 Web 內容。當一個網頁被請求時,伺服器在返回頁面給瀏覽器之前先執行頁面中的基於伺服器的代碼。通過伺服器的運行,代碼能執行複雜的任務,比如進入資料庫。
二、Razor代碼的語法
- Razor 代碼塊包含在 @{ ... } 中
- 內聯表達式(變數和函數)以 @ 開頭
- 代碼語句用分號結束
- 變數使用 var 關鍵字聲明
- 字元串用引號括起來
- C# 代碼區分大小寫
- C# 文件的擴展名是 .cshtml
下麵請看一個案例:
(1)創建一個以.cshtml結尾的頁面:
(2)然後代碼
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> @{ var message = "李白是最帥的,沒有之一"; } <p>對於他的粉絲來說:@message</p> @{ var name = "李白"; string techno = "青蓮劍歌"; string action = name + "在面對十萬敵人時,毫無懼色,使出了:" + techno + "技能,橫掃八方"; } <p>@action</p> </body> </html>
使用對象
比如說內置對象Date:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> <table border ="1"> <tr><th width="100px">Name</th> <td width ="100px">Value</td> </tr> <tr> <td>Day</td> <td>@DateTime.Now.Day</td> </tr> <tr> <td>Hour</td> <td>@DateTime.Now.Hour</td> </tr> <tr> <td>Minute</td> <td>@DateTime.Now.Minute</td> </tr> <tr> <td>Second</td> <td>@DateTime.Now.Second</td> </tr> </table> </body> </html>
變數
變數是用來存儲數據的。一個變數的名稱必須以字母字元開頭,並且不能包含空格或者保留字元。一個變數可以是一個指定的類型,表示它所存儲的數據類型。string 變數存儲字元串值("Welcome to RUNOOB.COM"),integer 變數存儲數字值(103),date 變數存儲日期值,等等。變數使用 var 關鍵字聲明,或通過使用類型(如果您想聲明類型)聲明,但是 ASP.NET 通常能自動確定數據類型。
@{ var message = "李白是最帥的,沒有之一"; string name = "李白"; }
轉換數據類型
從一種數據類型轉換到另一種數據類型,有時候是很有用的。最常見的例子是將字元串輸入轉換為另一種類型,如整數或者日期。
一般規則下,都是將用戶輸入看做字元串處理,即使用戶輸入了數字。因此數值輸入必須被轉換成數字,然後才能將其用於計算。
下麵列出了常用的轉換方法:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body style="background-color: beige; font-family: Verdana, Arial;"> @{ var totalMessage = ""; if(IsPost) { var num1 = Request["text1"]; var num2 = Request["text2"]; //將string類型轉換成為int類型 var total = num1.AsInt() + num2.AsInt(); totalMessage = "Total = " + total; } } <html> <body style="background-color: beige; font-family: Verdana, Arial;"> <form action="" method="post"> <p><label for="text1">First Number:</label><br> <input type="text" name="text1" /></p> <p><label for="text2">Second Number:</label><br> <input type="text" name="text2" /></p> <p><input type="submit" value=" Add " /></p> </form> <p>@totalMessage</p> </body> </html>
迴圈
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> <!-- For 迴圈 如果需要重覆運行相同的語句,您可以編寫一個迴圈。 如果您能夠確定迴圈的次數,則可以使用 for 迴圈。這種迴圈類型是專門為計數或反向計數設計的: --> @for(int i = 0;i< 20;i++) { <p>Line :@i</p>} <!-- For Each 迴圈 如果您需要處理集合或數組,則通常要用到 for each 迴圈。 集合是一組相似的對象,for each 迴圈允許您在每個項目上執行一次任務。for each 迴圈會遍歷集合直到完成為止。 下麵的例子遍歷 ASP.NET Request.ServerVariables 集合。 --> <ul> @foreach(var x in Request.ServerVariables) { <p>@x</p> } </ul> <!-- while 是一種通用的迴圈。 while 迴圈以關鍵詞 while 開始,後面跟括弧,其中定義迴圈持續的長度,然後是要迴圈的代碼塊。 while 迴圈通常會對用於計數的變數進行增減。 在下麵的例子中,迴圈每運行一次,+= 運算符就向變數 i 增加 1。 --> @{ var j = 0; while (j < 5) { j += 1; <p>Line #@j</p> } } </body> </html>
迴圈綜合實例
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> @{ string[] members = {"Jani", "Hege", "Kai", "Jim"}; int i = Array.IndexOf(members, "Kai")+1; int len = members.Length; string x = members[2-1]; } <html> <body> <h3>Members</h3> @foreach (var person in members) { <p>@person</p> } <p>The number of names in Members are @len</p> <p>The person at position 2 is @x</p> <p>Kai is now in position @i</p> </body> </html> </body> </html>