Razor入门

在学习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>[email protected]</div>

    <!--基础语法2::::字符串拼接-->
    <div>
        字符串拼接: aa @name bb
    </div>

    <div>
        字符串拼接:[email protected]{@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 = @"""[email protected]#$%^\""";

             @*
            注意,输出双引号时,前面要多加一对双引号转义
            *@

            }
    </div>

    <div>
        @password
    </div>

    <div>
        @@
    </div>
    

运行后,结果如图:

我们在网页上查看源码,会看到纯HTML代码(部分如图):

可见,Razor最后被解析成了HTML形式显示出来。

三,工作原理解析

Razor 网页可被描述为带有两种内容的HTML 页面:HTML 内容和 Razor 代码。

当服务器读取这种页面后,在将 HTML页面发送到浏览器之前,会首先运行 Razor代码。这些在服务器上执行的代码能够完成浏览器中无法完成的任务,比如访问服务器数据库。服务器代码能够在页面被发送到浏览器之前创建动态的 HTML内容。从浏览器来看的话,由服务器代码生成的 HTML 与静态 HTML 内容没有区别,例如,咱们上面查看到的网页源码。

时间: 2024-10-05 10:29:58

Razor入门的相关文章

ASP.NET MVC5 + EF6 入门教程 (6) View中的Razor使用

文章来源: Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc-5-ef-6-get-started-model.html 上一节:ASP.NET MVC5 + EF6 入门教程 (5) Model和Entity Framework 源码下载:点我下载 一.Razor简介 在解决方案资源管理器中查看Views文件夹下的文件,如下图所示. 文件的后缀名都是.cshtml.这是什么文件呢?顾名思义,cshtml = cs + html,就是一个包含C S

MVC Razor视图引擎的入门

首先我们来说说他的给我们开发者带来那些好处吧: Razor语法易于输入,易于阅读,微软当时是这样定义的:简洁,富有表现力和灵活性,支持所有文本编辑器,强大的智能提示功能,单元测试. Rozor文件类型 RazorC#中是  .csHtml Razor的标识符 "@" @foreach(var album in Model.Albums) { <li>@album </li> }

使用VSCode创建简单的Razor Webapp--1.入门

1.下载vscode,安装dotnet core sdk 在cmd中使用命令dotnet --version可以查看当前安装的版本 2.打开vscode,设置语言和扩展 在最左边的工具栏,点击最下面的扩展按钮 搜索并安装如下两项 3.新建项目 按CTRL+~键,打开命令终端 输入以下命令 dotnet new webapp 是在当前文件夹下新建了一个名为RazorDemo的webapp项目 成功后输入code -r RazorDemo 即在vscode的当前实例中打开RazorDemo文件夹.

Asp.Net MVC4入门指南(1): 入门介绍

前言 本教程将为您讲解使用微软的Visual Studio Express 2012或Visual Web Developer 2010 Express Service Pack 1 来建立一个ASP.NET MVC4 Web应用程序所需要的基础知识.建议您使用Visual Studio 2012,你将不再需要安装任何组件,来完成此教程.如果您使用的是Visual Studio 2010,您必须安装下面的组件.您可以通过点击下面的链接,来安装所需的所有组件: Visual Studio Web

ASP.NET MVC 5 入门教程 (4) View和ViewBag

文章来源: Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc-5-get-started-view.html 上一节:ASP.NET MVC 5 入门教程 (3) 路由Route 源码下载:点我下载 View(视图)用来显示被controller处理好的数据.本节我们就来看看如何通过controller访问一个View页面,如何从controller向View传值. 打开Controllers文件夹下的FirstController.cs,我们把其

Asp.net MVC入门视频教程

编程开发 > Asp.net视频教程 > Asp.net MVC入门视频教程 > 1.传统web处理方式和mvc处理方式 上传日期:2014-08-16 10:02:45  相关摘要:  - 怎么一创建传统补间就成了上下移动的了 - web 服务器 第一次进入站点速度慢是什么问题?? - EF中怎么处理像Sql多表连接的问题? 2.mvc项目会自动导入mvc程序集 上传日期:2014-08-16 10:14:51  相关摘要:  - Asp.net mvc 可以不用js吗 - 项目发布的

快速入门系列--MVC--01概述

虽然使用MVC已经不少年,相关技术的学习进行了多次,但是很多技术思路的理解其实都不够深入.其实就在MVC框架中有很多设计模式和设计思路的体现,例如DependencyResolver类就包含我们常见的DI依赖注入概念和注册表模式(GetService)等内容,ExceptionFilter等过滤器就体现AOP的概念,整个MVC内置了一个IOC容器,基本上所有的框架类的对象都是通过这种方式来创建的.此外,一直觉得很j2ee的spring很棒,其实如果大家很熟悉EHAB(微软企业开发库)的话,就会发

Windsor入门教程---第一部分 获取Windsor

介绍 从开发环境的角度看,Windsor只是一个类库.不需要安装,也不需要额外的工具,你直需要获取Windsor的类库到你的电脑上就可以了. 获取 有几个方法可以获取到Windsor,可以使用包管理工具OpenWrap,也可以使用微软的NuGet,或者也可以手动下载Windsor.最简单的方法就是使用Nuget,我们接下来就是使用NoGet. 新建解方案 启动Visual Studio 新建项目---ASP.NET MVC 3 Web Application 选择Internet 和 Razor

Asp.Net MVC3 简单入门第一季(一)环境准备

前言 大家好,从今天开始我将写一个关于AspNet MVC3方 面学习的总结,并跟初学者一起分享一些基本的基础知识,作者本身也很愿意跟大家一起交流技术,一起交流一起进步,欢迎高手不吝赐教,欢迎大家不同的意见和 建议,作者的学识和见识当然有自己的局限性,希望自己能成为不闷骚型的技术人员,而不是只自己享受技术,而不让更多的人来分享你的成果的人. 第一节:关于Asp.Net MVC3 Asp.Net MVC已经到第三版了,相信大家也都熟悉了,我也不再重复相关概念性的东西了.但是大家一定要了解,Asp.