JRazor--史上最简单性能最高的html模板引擎,前端开发设备

`//这是javascript注释,第一个`号代表此行将被解析为javascript,紧随其后的//或/**为常规的javascript注释

`/**

`JRazor方法论:

`工具集成:

`    JRazor充分照顾主流的开发工具,如代码的高亮、结构校验、快捷键等。

`关于轮子:

`    没本事造轮子的人才说不要重复造轮子。

`两种视角:

`    框架视角:JRazor的本质是javascript,模板中的每一行(包括注释和空行)都将被预编译为javascript代码,您可以在浏览器控制台看到预编译好的代码;

`    开发视角:JRazor是一个HTML片段,因此JRazor优先照顾HTML代码的原汁原味。

`我的纠结:

`    JRazor将按行解析模板的内容,以反引号`(或构造函数声明的其他符号)开始的行将被解析为javascript,以其他字符开始的行将被解析为html;

`    牢记"按行解析"四个字很重要,您的一行代码中一定不能既有html又有javascript;

`    之所以按行解析,而不使用正则解析,是在性能、核心代码量、可读性综合权衡后所作出的选择。

`前端福祉:

`    `${}`是es6给前端工程师带来的最有诚意的礼物,

`    您在编写JRazor模板代码时应充分利用`${}`,任何说明性的文字都不如您亲自打开控制台看看预编译好的代码是如何工作的。

`关于源码:

`    如果您打开jrazor.js文件后发出“什么鬼,这叫框架?”的感叹,

`    那么作者会很欣慰,没错,这就是一个将近40岁的老头子搞出来的东西,100行不到的代码就是JRazor的全貌;

`帮助文档:

`    我还能说什么呢?祝您工作愉快,全家美满!用JRazor,长头发,奥利给!

`*/

${model.title} 宠物 名称 颜色

`model.animals.forEach(function(item){

`//建议使用forEach或for in 会使代码看起来更干净

${item.name} ${item.color}

`})

衣服 名称 价格

`for(let i=0;i<model.clothes.length;i++){

`var item=model.clothes[i];

${item.name}

`//以下演示if else 和 三元运算符

`if(item.price<200){

`}else{

`}

`}

  • 8
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值