ASP.NET的视图(Razor)循环产生html代码
需要要视图中Razor语法,循环产生一些html代码。
产生后的html是这样的:
<li data-transition="fade" data-slotamount="" data-masterspeed="">
<img src="~/Content/img/slider-images/XXX1111.jpg" alt="XXX2222">
<div class="tp-caption tp-resizeme sfb fadeout white-color very_large_text"
data-x="center"
data-y="center"
data-voffset=""
data-speed=""
data-start=""
data-easing="Power4.easeOut">
<h1>
XXX3333
</h1>
</div>
</li>
Source Code
上面的图片中,只是高亮部分不相同。
最懒的主法,循环几次,拷贝与粘贴几次,然后修改不相同(高亮)的代码。
第二种方法,使用C#的循环产生:
SliderEntity se = new SliderEntity();
se.Sliders().ForEach(delegate (Slider s)
{
WriteLiteral("<li data-transition=\"fade\" data-slotamount=\"7\" data-masterspeed=\"1500\">");
WriteLiteral("<img src=\"" + Url.Content("~/Content/img/slider-images/" + s.ImageUrl) + "\" alt=\"" + s.Description + "\"/>");
WriteLiteral("<div class=\"tp-caption tp-resizeme sfb fadeout white-color very_large_text\"");
WriteLiteral("data-x=\"center\"");
WriteLiteral("data-y=\"center\"");
WriteLiteral("data-voffset=\"0\"");
WriteLiteral("data-speed=\"1000\"");
WriteLiteral("data-start=\"1800\"");
WriteLiteral("data-easing=\"Power4.easeOut\">");
WriteLiteral("<h1>");
WriteLiteral(s.Title);
WriteLiteral("</h1>");
WriteLiteral("</div>");
WriteLiteral("</li>");
});
Source Code
这种方法,会比第一种方法好,毕竟它已经使用了Foreach方法了。不过在创建这个方法时,也得花上不少时间。使用"\"来处理双引号的问题。
第三种,Insus.NET想到,直接使用Razor的foreach方法,它也是循环,不过它神奇的快速实现:
@foreach (var item in (new SliderEntity()).Sliders())
{
<li data-transition="fade" data-slotamount="" data-masterspeed="">
<img src="~/Content/img/slider-images/@item.ImageUrl" alt=@item.Description>
<div class="tp-caption tp-resizeme sfb fadeout white-color very_large_text"
data-x="center"
data-y="center"
data-voffset=""
data-speed=""
data-start=""
data-easing="Power4.easeOut">
<h1>
@item.Title
</h1>
</div>
</li>
}
Source Code
快的原因,foreach方法,直接可以写html代码。
ASP.NET的视图(Razor)循环产生html代码的更多相关文章
- ASP.NET MVC 3 Razor 视图引擎 基本语法
本篇博文将进入MVC 3 的世界了,首先学习一下MVC 3 新增的Razor视图引擎的基本语法. 1. 使用 @ 字符将代码添加到页面中.正如传统的aspx视图的<% %>相同. ...
- (转)Asp.Net Mvc视图引擎Razor介绍
Asp.Net Mvc视图引擎Razor介绍 1.Razor介绍 程序园原创,转载请注明:http://www.kwstu.com/ArticleView/dabaomvc_2014082408205 ...
- ASP.NET MVC 自定义Razor视图WorkContext
概述 1.在ASP.NET MVC项目开发的过程中,我们经常需要在cshtml的视图层输出一些公用信息 比如:页面Title.服务器日期时间.页面关键字.关键字描述.系统版本号.资源版本号等 2.普通 ...
- ASP.NET MVC 3: Razor中的@:和语法
原文 ASP.NET MVC 3: Razor中的@:和语法 [原文发表地址] ASP.NET MVC 3: Razor’s @: and <text> syntax[原文发表时间] De ...
- ASP.NET MVC 视图(五)
ASP.NET MVC 视图(五) 前言 上篇讲解了视图中的分段概念.和分部视图的使用,本篇将会对Razor的基础语法简洁的说明一下,前面的很多篇幅中都有涉及到视图的调用,其中用了很多视图辅助器,也就 ...
- ASP.NET MVC 视图(四)
ASP.NET MVC 视图(四) 前言 上篇对于利用IoC框架对视图的实现进行依赖注入,最后还简单的介绍一下自定义的视图辅助器是怎么定义和使用的,对于Razor语法的细节和辅助器的使用下篇会说讲到, ...
- ASP.NET MVC 视图(三)
ASP.NET MVC 视图(三) 前言 上篇对于Razor视图引擎和视图的类型做了大概的讲解,想必大家对视图的本身也有所了解,本篇将利用IoC框架对视图的实现进行依赖注入,在此过程过会让大家更了解的 ...
- ASP.NET MVC 视图(二)
ASP.NET MVC 视图(二) 前言 上篇中对于视图引擎只是做了简单的演示,对于真正的理解视图引擎的工作过程可能还有点模糊,本篇将会对由MVC框架提供给我们的Razor视图引擎的整个执行过程做一个 ...
- ASP.NET MVC 视图(一)
ASP.NET MVC 视图(一) 前言 从本篇开始就进入到了MVC中的视图部分,在前面的一些篇幅中或多或少的对视图和视图中的一些对象的运用进行了描述,不过毕竟不是视图篇幅说的不全面,本篇首先为大家讲 ...
随机推荐
- mysql进阶之存储过程
往往看别人的代码会有这样的感慨: 看不懂 理还乱 是离愁 别是一番滋味在心头 为什么要使用存储过程? 在mysql开发中使用存储过程的理由: 当希望在不同的应用程序或平台上执行相同的函数,或者封装特定 ...
- .NET面试题集锦①(Part一)
一.前言部分 文中的问题及答案多收集整理自网络,不保证100%准确,还望斟酌采纳. 1.面向对象的思想主要包括什么? 答:任何事物都可以理解为对象,其主要特征: 继承.封装.多态.特点:代码好维护,安 ...
- 安装并使用PHPunit
安装并使用PHPunit Linux 下安装PHPunit PHP 档案包 (PHAR) 要获取 PHPUnit,最简单的方法是下载 PHPUnit 的 PHP 档案包 (PHAR),它将 PHPU ...
- 嵌入式C语言代码的调试技巧
在项目开发的过程中,不可避免的会遇到调试代码的情况. 刚开始写代码时,我们想看具体执行到哪儿时,往往这么写: printf("***** Code is here! *****\n" ...
- Dubbo学习小记
前言 周一入职的新公司,到了公司第一件事自然是要熟悉新公司使用的各种技术,搭建本地的环境. 熟悉新公司技术的过程中,首先就是Maven,这个前面已经写过文章了,然后就是Dubbo----公司的服务都是 ...
- Microsoft Azure Web Sites应用与实践【4】—— Microsoft Azure网站的“后门”
Microsoft Azure Web Sites应用与实践 系列: [1]—— 打造你的第一个Microsoft Azure Website [2]—— 通过本地IIS 远程管理Microsoft ...
- 一种简单的md5加盐加密的方法(防止彩虹表撞库)
md5加密(或者说摘要算法)大家都很熟悉了 就不解释了 现在很多数据库设计都喜欢用单向加密的方式保存密码,验证时对提交的密码再次加密之后做密文对比 /// <summary> 使用MD5加 ...
- ASP.net 内置对象
.net初学者,有错误欢迎指正.大家共同进步 Response 输出数据 Reponse对象和Request对象组成了一对发送,接受数据的对象. 发送信息:Reponse.Write("字符 ...
- Atitit 图像处理和计算机视觉的分类 三部分 图像处理 图像分析 计算机视觉
Atitit 图像处理和计算机视觉的分类 三部分 图像处理 图像分析 计算机视觉 1.1. 按照当前流行的分类方法,可以分为以下三部分:三部分 图像处理 图像分析 计算机视觉1 1.2. 图像处理需要 ...
- 01.Web大前端时代之:HTML5+CSS3入门系列~初识HTML5
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...