ウェブページかみそり

ASP.NET Web ページ - Razor コードの追加

このチュートリアルでは、C# および Visual Basic コードで Razor マークアップを使用します。

カミソリとは何ですか?

Razor は、サーバーベースのコードを Web ページに追加するためのマークアップ構文です
Razor は、従来の ASP.NET マークアップの機能を備えていますが、より使いやすく、学習も簡単です
Razor はサーバーですASP や PHP とよく似た -side マークアップ構文
Razor は C# および Visual Basic プログラミング言語をサポートします

Razor コードを追加します

前の章の例の Web ページを思い出してください:

<! DOCTYPE html>

<html lang="en">
<head>
<meta charset="utf-8" />
<title>Web ページのデモ</title>
</head>
<body>
<h1>Hello Web Pages</h1>
</body>
</html>

次に、Razor コードをインスタンスに追加します:

Instance

<!DOCTYPE html>
<html>
<body>
     <h1>Hello Web Pages</h1> 
     <p>The time is @DateTime.Now</p>
</body>
</html>

Run Instance»

[サンプルの実行] ボタンをクリックして、オンラインのサンプルを表示します

このページには、通常の HTML タグが含まれており、@ でマークされた Razor コードも追加されます。

Razor コードは、サーバー上でさまざまなアクションをリアルタイムで完了し、結果を表示できます。 (書式設定オプションを指定できます。指定しない場合は、デフォルトの項目のみが表示されます。)

Razor C# の主な構文規則

Razor コードブロックは @{ ... } で囲まれます
インライン式 ( 変数と関数) @
で始まるコードステートメントはセミコロンで終わります
変数はvarキーワードを使用して宣言されます
文字列は引用符で囲まれます
C#コードは大文字と小文字が区別されます
C# ファイルは .cshtml です

例

<html>
<body>
<!-- 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>
</body>
</html>

例の実行»

オンライン例を表示するには、[例の実行] ボタンをクリックしてください

Razor VB の主な構文規則

R azor コードブロックは @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>

サンプルの実行»

[サンプルの実行] ボタンをクリックしてオンラインサンプルを表示します

C# と Visual Basic の詳細

Razor、C#、Visual Basic プログラミング言語について詳しく知りたい場合は、こちらをご覧ください。このチュートリアルの Razor パート。