我的编程空间,编程开发者的网络收藏夹
学习永远不晚

ASP.NET中的Razor语法简介

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

ASP.NET中的Razor语法简介

Razor 不是一种编程语言。它是服务器端的标记语言。可以让您将基于服务器的代码(Visual Basic 和 C#)嵌入到网页中。

当服务器读取页面时,它首先运行 Razor 代码,然后再发送 HTML 页面到浏览器。在服务器上执行的代码能够执行一些在浏览器上不能完成的任务,比如,访问服务器数据库。服务器代码能创建动态的 HTML 内容,然后发送到浏览器。从浏览器上看,服务器代码生成的 HTML 与静态的 HTML 内容没有什么不同。

https://docs.microsoft.com/zh-cn/aspnet/web-pages/overview/getting-started/introducing-razor-syntax-c

一、Razor 语法

1、 Razor C# 语法规则

  • Razor 代码块包含在 @{ ... } 中 ,当行或多行。
  • 内联表达式(变量和函数)以 @ 开头 :@变量 或 @( 表达式 )
  • 代码语句用分号结束
  • 变量使用 var 关键字声明
  • 字符串用引号括起来
  • C# 代码区分大小写
  • C# 文件的扩展名是 .cshtml
<!-- 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>

2、Razor的作用域

大括号里面的就是表示作用域的范围,用形如 “@[code]”来写一段代码块。在作用域 “@(code)” 中输出也是用@符号的。

我的年龄:
@{
    int age = 25;
    string sex = "男";
    @age
}性别: @(sex)

3、Razor和Html混合编写

  • a.在作用域内容如果是以html标签开始则视为文本输出
  • b.如果输出@,则使用@@
  • c.如果需在代码块中直接输出纯文字而不带HTML标签,则可以使用@:标签,如果在 "@:" 后面加上@就表示Razor语句的变量。
@{
    var strzm = "abc";
    @:this is a mail:2734796332@qq.com.this is var:@strzm,this is mail@strzm,this is @@

    //输出abc
    @strzm
 }

如果需要在代码块中输出续或不连续的多行纯文本,则使用text标签较为方便。

@if (Model.Price > 5M) {
<text> 名称:<b>@Model.Name</b><br /> 分类:<b>@Model.Description</b><br /> 价钱:<b>@Model.Price</b><br /> <pre> 测试行一: <a>aaaa</a> 测试行二: @@ fda@aaa </pre> </text>

}

4、变量

一个变量的名称必须以字母字符开头,并且不能包含空格或者保留字符。变量使用 var 关键字声明,或通过使用具体类型声明。

// Using the var keyword:
var greeting = "Welcome to RUNOOB.COM";
var counter = 103;

// Using data types:
string greeting = "Welcome to RUNOOB.COM";
int counter = 103;

5、数据类型

  • int    整数(全数字)    103, 12, 5168
  • float    浮点数    3.14, 3.4e38
  • decimal    十进制数字(高精度)    1037.196543
  • bool    布尔值    true, false
  • string    字符串    "Hello RUNOOB.COM", "John"

6、转换数据类型(string类型才能转)

  • AsInt()\IsInt():    转换字符串为整数   
    if (myString.IsInt()){
       myInt=myString.AsInt();
    }
  • AsFloat()\IsFloat():    转换字符串为浮点数。  
  • AsDecimal()\IsDecimal():转换字符串为十进制数。
  • AsDateTime()\IsDateTime():    转换字符串为 ASP.NET DateTime 类型。  
  • AsBool()\IsBool():    转换字符串为布尔值。  
  • ToString():    转换任何数据类型为字符串。
    var  myInt=1234;
    myString=myInt.ToString();

7、循环

For 循环

<body>
@for(var i = 10; i < 21; i++) {<p>Line @i</p>}
</body>

For Each 循环

<body>
<ul>
@foreach (var x in Request.ServerVariables)
{
<li>@x</li>
}
</ul>
</body>

While 循环

<body>
@{ var i = 0; while (i < 5) {i += 1; <p>Line @i</p> } }
</body>

8、数组

</p>
<p>Kai is now in position@{
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 
@l
en</p>
<p>The person at position 2 is 
@x
</p>
<p>Kai is now in position 
@i
</p>
</body>
</html>

9、逻辑条件

If 条件

@{var price=50;}
<html>
<body>
@if (price>30)
{
<p>The price is too high.</p>

}
</body>
</html>

Else 条件

@{var price=20;}
<html>
<body>
@if (price>30)
{
<p>The price is too high.</p> } else { <p>The price is OK.</p>

} 
</body>
</html>

Else If 条件

@{var price=25;}
<html>
<body>
@if (price>=30) { <p>The price is high.</p> } else if (price>20 && price<30) { <p>The price is OK.</p> } else { <p>The price is low.</p> }
</body>
</html>

Switch 条件

@{
var weekday=DateTime.Now.DayOfWeek;
var day=weekday.ToString();
var message="";
}
<html>
<body>
@switch(day)
{
case "Monday":
message="This is the first weekday.";
break;
case "Thursday":
message="Only one day before weekend.";
break;
case "Friday":
message="Tomorrow is weekend!";
break;
default:
message="Today is " + day;
break;
}
<p>
@message
</p>
</body>
</html>

二、Razor引擎

1、布局(Layout)(@RenderBody()方法)

解释:Layout方式布局就相当于一个模板,我们在它地址地方去添加代码。类似于ASP.NET母版页中的ContentPlaceHolder服务器控件,在MVC中使用@RenderBody()来呈现子Web页面的内容,它可以省去我们在每个视图文件中写相同的html元素、JS和样式等的工作。 
母版页:(~/Views/Layout/_SiteLayout.cshtml)

母版的呈现是MVC内部处理的,这种以下划线(_)开头的视图文件,一般是不能直接返回给用户。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>我的网站 - @Page.Title</title>
    </head>
    <body>
        @RenderBody()
    </body>
</html>

子页面:(~/Views/Home/About.cshtml)

@{
    Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h1>
    关于我的网站
</h1>
<p>
    这是一些内容显示在关于我们这个页面,我们用的是SiteLayout.cshtml这个主页母版页。
    <br />
    当前时间:@DateTime.Now
</p>

2、页面(@RenderPage()方法)

解释:page当需要在一个页面中,输出另外一个Razor文件(页面)的内容时候用到,比如头部或尾部这些公共的内容时需要用到,用@RenderPage()方法

母版页:(~/Views/Layout/_SiteLayout.cshtml)

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Simple Site</title>
</head>
<body>
   <!--头部-->    
   @RenderPage("~/Views/Layout/_header.cshtml")
</body>
</html>

公共页:(~/Views/Layout/_header.cshtml)

<div id="header">
        <a href="#" rel="external nofollow"  rel="external nofollow" >主页</a>
        <a href="#" rel="external nofollow"  rel="external nofollow" >关于我们</a>
</div>

3、Section区域(@RenderSection())

解释:Section是定义在Layout的页面中使用的。在Layout的页面中用。在要Layout的父页面中使用@RenderSection()方法。

  • @RenderSecion()这个占位符表示:在这里会渲染页面里面的一个节(可以是html代码也可以是c#代码和Html的结合体)。
  • @RenderSection("scripts", required: false)做一个补充说明,第一个参数指明:在子页面被渲染的节的名称,第二个参数:指定子页面这个节是否是必需的,如果指定了required:true;但是在子页面没有给这个名称的节的话,编译是通不过的。

母版页:(~/Views/Layout/_SiteLayout.cshtml)

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Simple Site</title>
</head>
<body>
    <div id="left-menu">
        @RenderSection("menu",true)
    </div>
</body>
</html>

公共页:(~/Views/Layout/_menu.cshtml)

@{
    Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h1>
    关于我的网站
</h1>
<p>
    这是一些内容显示在关于我们这个页面,我们用的是SiteLayout.cshtml这个主页母版页。
    <br />
    当前时间:@DateTime.Now
</p>
@section menu{
    
<ul id="sub-menu"> <li>菜单1</li> <li>菜单2</li> <li>菜单3</li> <li>菜单4</li> </ul> }

如果在子页面中没有去实现了menu了,则会抛出异常。我们可以使用它的重载@RenderSection("menu", false)

@if (IsSectionDefined("menu")) { @RenderSection("menu", false) } else { <p>menu Section is not defined!</p> }

三、Razor 帮助器

ASP.NET 帮助器是通过几行简单的 Razor 代码即可访问的组件。您可以使用 Razor 语法构建自己的帮助器,或者使用内建的 ASP.NET 帮助器。

下面是一些有用的 Razor 帮助器的简短说明:

  • Web Grid(Web 网格)
  • Web Graphics(Web 图形)
  • Google Analytics(Google 分析)
  • Facebook Integration(Facebook 集成)
  • Twitter Integration(Twitter 集成)
  • Sending Email(发送电子邮件)
  • Validation(验证)

@Href("~/")//表示网站的根目录 
@Html.Raw('<font color='red'>红字</font>')就会显示出红色的”红字“,不用的话会直接显示这段html字符串(<font color='red'>红字</font>)

自定义Helper

 @helper就是可以定义可重复使用的帮助器方法,不仅可以在同一个页面不同地方使用,还可以在不同的页面使用。

1、新建一个HelperMath.cshtml页面

2、HelperMath.cshtml页面写方法

@*求和*@
@helper sum(int a, int b)
{
    int result = a + b;
    @result
}

3、Index.cshtml页面调用

1+2= @HelperMath.sum(1, 2)
 <br />

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程网。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

ASP.NET中的Razor语法简介

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

ASP.NET中的Razor语法是什么

本文小编为大家详细介绍“ASP.NET中的Razor语法是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“ASP.NET中的Razor语法是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。Razor 不是一
2023-07-02

ASP.NET中Razor语法怎么使用

Razor语法是一种在ASP.NET中用于创建动态网页的模板引擎。它允许开发人员将C#或VB.NET代码与HTML标记混合在一起,以便更轻松地生成动态内容。以下是一些常用的Razor语法示例:在HTML标记中嵌入C#代码:Welcome,
2023-10-23

ASP.NET Core中的Razor页面怎么创建

这篇文章主要介绍“ASP.NET Core中的Razor页面怎么创建”,在日常操作中,相信很多人在ASP.NET Core中的Razor页面怎么创建问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ASP.NET
2023-06-29

ASP.NET MVC 3中的Razor特性怎么使用

本篇内容主要讲解“ASP.NET MVC 3中的Razor特性怎么使用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“ASP.NET MVC 3中的Razor特性怎么使用”吧!开工 目录在_Vie
2023-06-17

css3中媒体查询的语法简介

小编给大家分享一下css3中媒体查询的语法简介,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!媒体查询的语法组成是“@media not|only mediatype and (expressions) {CSS代码...;
2023-06-14

Golang简介与基本语法的学习

这篇文章主要介绍了Golang简介与基本语法的学习,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
2023-05-16

简要介绍Go语言中的运算符

Go语言中运算符的使用方法简介一、算术运算符Go语言中常见的算术运算符有加法运算符"+"、减法运算符"-"、乘法运算符"*"、除法运算符"/"、取余运算符"%"等。下面是一些常见的算术运算符的使用方法及代码示例:加法运算符:用于两个数相加
简要介绍Go语言中的运算符
2024-01-18

编程热搜

目录