html js php 混编,Razor标记语言和HTML,js混编

Razor

Razor 是asp.net mvc下的一种前端标记语法类似jquery 以及PHP或者java的jsp中的标记语法，但是更加优雅和方便。逻辑都是后端代码。在这里我用的是C#,对于前端小白来说是很好理解的。具体的使用方法可以百度Razor教程 会有很多的基础教育平台。这不是本文讨论的重点。Razor在前端界面中需要和HTML或js混编，如果混编的格式不对会引起前端的页面的页面渲染混乱，或者js的失效。本文将和大家讨论怎么使用混编。欢迎各位道友讨论，斧正。

1.C#与Html混编

这个是大家都比较熟悉的混编方式 也是Razor的主要用法， 可以实行用后端的C#进行传值和简单的页面逻辑判断。比较优雅的实行mvc模式下的前端代码的编写。也使对前端的编码效率有了提升。

混编代码实例

效果

可以看出 一般比较长的C#代码可以用中括号｛｝包含起来编写 其中添加HTMl代码是没有影响的 但是要有明确的HTML开始符和结束符。

而Html语言中插入C#代码需要加入@关键字 不然会被当成一般字符识别使用

还有for循环

当前台的C#代码有多行时，如果这些代码是连续的中间没有HTML代码隔断，那只需要开头的一个@符号即可。

当然也可以在C#中向前台打印输出一些值 这就要用到 @：

总之 @： 负责打印 @负责输出变量 也可以 @：@变量名 这样的方式打印变量

2.js与Html混编

在js中 由于没有Html那样的开始标签和结束标签 在 C#中不能直接输入js代码 这样就没办法实行混编了 这个时候就是出马了

这也是我在网上找了好几篇文章才发现的新奇知识点(原谅我这个小白) 先上代码

model为空时js的代码为

model不为空时js的代码为

若不加上 标签 js代码就会被当成 C#代码执行 不仅不能达到我们的目的还会是我们的的js或C#代码失效和报错

这点有兴趣的道友可以验证一下就不列出错误代码了。

最后！注意 Razor会先执行C#代码 所以HTML和JS是无法对C#代码赋值和判断的 只有等到C#编译生成确切的标量值后才会执行JS和Html代码