在学习MVC的时候,创建控制器总会看到默认的Razor:
然后,我们就可以在创建的视图里面这样写:
<!--创建用户名文本框,等同于<input type="text">--> @* @Html.TextBoxFor(model=>model.UserName)*@
那么,这些带有@的看起来又不像html的但是放在视图上的东东是什么呢?我们还是从最头开始聊吧~~
一,什么是Razor?
Razor 是一种允许您向网页中嵌入基于服务器的代码(Visual Basic 和 C#)的标记语法。
当网页被写入浏览器时,基于服务器的代码能够创建动态内容。在网页加载时,服务器在向浏览器返回页面之前,会执行页面内的基于服务器代码。由于是在服务器上运行,这种代码能执行复杂的任务,比如访问数据库。
Razor 基于 ASP.NET,它为 web 应用程序的创建而设计。它拥有传统 ASP.NET 标记的能力,但更易使用,也更易学习。
对程序猿们来说,大家比较熟悉的语言还是偏向服务器端的这种语言,感觉它比html写起来更容易。。。而且功能更强大,也非常好学!(好处还在挖掘中。。)
二,语法规则
以C#为例,
Demo示例:
<!--基础语法1:以@符号+{代码块},或以@符号开头。--> <!--在代码块中声明变量要以分好结束,使用变量时无需加分号--> <!--在@符号前面不能有任何html字符,否则变量将以字符串的形式原样输出--> <!--在C#在列中写变量的时候一样,Razor中也是区分大小写的--> <div> @{int id = 100; var ID = 101; string Name = "大写名称"; string name = "变量区分大小写"; } </div> <div>@id</div> <div>@ID</div> <div>@Name </div> <div>@name</div> <div>Hi@name</div> <!--基础语法2::::字符串拼接--> <div> 字符串拼接: aa @name bb </div> <div> 字符串拼接:Begin@{@Name} End </div> <!--基本语法3::::文本使用--> <div> @{ <div> 内部<br/> 文本一 </div> @:内部<br/>文本二 } </div> <!--基本语法4::::注释用法--> <div> @{ //注释一,单行注释 @* 注释二,多行注释 *@ } </div> <!--基本语法5::::循环语句用法--> <div> @{ for(int i=0;i<10;i++) { @:@i } } </div> <!--基本语法6::::特殊符号用法--> <div> @{ var password = @"""123456!@#$%^\"""; @* 注意,输出双引号时,前面要多加一对双引号转义 *@ } </div> <div> @password </div> <div> @@ </div>
运行后,结果如图:
我们在网页上查看源码,会看到纯HTML代码(部分如图):
可见,Razor最后被解析成了HTML形式显示出来。
三,工作原理解析
Razor 网页可被描述为带有两种内容的HTML 页面:HTML 内容和 Razor 代码。
当服务器读取这种页面后,在将 HTML页面发送到浏览器之前,会首先运行 Razor代码。这些在服务器上执行的代码能够完成浏览器中无法完成的任务,比如访问服务器数据库。服务器代码能够在页面被发送到浏览器之前创建动态的 HTML内容。从浏览器来看的话,由服务器代码生成的 HTML 与静态 HTML 内容没有区别,例如,咱们上面查看到的网页源码。