Latest web development tutorials

ASP.NET Razor 語法

Razor 同時支持C# (C sharp) 和VB (Visual Basic)。


主要的Razor C# 語法規則

  • Razor 代碼塊包含在@{ ... } 中
  • 內聯表達式(變量和函數)以@ 開頭
  • 代碼語句用分號結束
  • 變量使用var 關鍵字聲明
  • 字符串用引號括起來
  • C# 代碼區分大小寫
  • C# 文件的擴展名是.cshtml

C# 實例

<!-- Single statement block -->
@{ var myMessage = "Hello World"; }

<!-- Inline expression or variable -->
<p>The value of myMessage is: @myMessage </p>

<!-- Multi-statement block -->
@{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}

<p>The greeting is: @greetingMessage </p>

運行實例»


主要的Razor VB 語法規則

  • Razor 代碼塊包含在@Code ... End Code 中
  • 內聯表達式(變量和函數)以@ 開頭
  • 變量使用Dim 關鍵字聲明
  • 字符串用引號括起來
  • VB 代碼不區分大小寫
  • VB 文件的擴展名是.vbhtml

實例

<!-- Single statement block -->
@Code dim myMessage = "Hello World" End Code

<!-- Inline expression or variable -->
<p>The value of myMessage is: @myMessage </p>

<!-- Multi-statement block -->
@Code
dim greeting = "Welcome to our site!"
dim weekDay = DateTime.Now.DayOfWeek
dim greetingMessage = greeting & " Here in Huston it is: " & weekDay
End Code


<p>The greeting is: @greetingMessage </p>

運行實例»


它是如何工作的?

Razor 是一種將服務器代碼嵌入在網頁中的簡​​單的編程語法。

Razor 語法是基於ASP.NET 框架,專門用於創建Web 應用程序的部分Microsoft.NET 框架。

Razor 語法支持所有ASP.NET 的功能,但是使用的是一種簡化語法,對初學者而言更容易學習,對專家而言更有效率的。

Razor 網頁可以被描述成帶以下兩種類型內容的HTML 網頁: HTML 內容和Razor 代碼。

當服務器讀取頁面時,它首先運行Razor 代碼,然後再發送HTML 頁面到瀏覽器。 在服務器上執行的代碼能夠執行一些在瀏覽器上不能完成的任務,比如,訪問服務器數據庫。 服務器代碼能創建動態的HTML 內容,然後發送到瀏覽器。 從瀏覽器上看,服務器代碼生成的HTML 與靜態的HTML 內容沒有什麼不同。

帶Razor 語法的ASP.NET 網頁有特殊的文件擴展名cshtml(Razor C#)或者vbhtml(Razor VB)。


使用對象

服務器編碼往往涉及到對象。

"Date" 對像是一個典型的內置的ASP.NET 對象,但對像也可以是自定義的,一個網頁,一個文本框,一個文件,一個數據庫記錄,等等。

對像有用於執行的方法。 一個數據庫記錄可能有一個"Save" 方法,一個圖像對象可能有一個"Rotate" 方法,一個電子郵件對象可能有一個"Send" 方法,等等。
對像也有用於描述各自特點的屬性。 一個數據庫記錄可能有FirstName 和LastName 屬性。

ASP.NET Date 對像有一個Now 屬性(寫成Date.Now),Now 屬性有一個Day 屬性(寫成Date.Now.Day)。 下面實例演示瞭如何訪問Data 對象的一些屬性:

實例

<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>
</td>
</table>

運行實例»


If 和Else條件

動態網頁的一個重要特點是,您可以根據條件決定做什麼。

做到這一點的常用方法是使用if ... else 語句:

實例

@{
var txt = "";
if(DateTime.Now.Hour > 12)
{txt = "Good Evening";}
else
{txt = "Good Morning";}
}
<html>
<body>
<p>The message is @txt </p>
</body>
</html>

運行實例»


讀取用戶輸入

動態網頁的另一個重要特點是,您可以讀取用戶輸入。

輸入是通過Request[] 功能讀取的,並且傳送輸入數據是經過IsPost 條件判斷的:

實例

@{
var totalMessage = "";
if(IsPost)
{
var num1 = Request["text1"];
var num2 = Request["text2"];
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>

運行實例»