Razor.js,基于JavaScript的Razor实现
哈罗大家好,之前造了JS模板轮子Otmpl,虽然勉强算不错,但是和MVC Razor的简洁优雅相比,简直是惨不忍睹。经过几天的研究,终于在参考国外一些牛人的代码后,展现出第一版,欢迎各位园友拍砖讨论。
- if-else 判断。
- do-while 循环。
- while 循环。
- for 循环。
- helper 方法。
- `*注释*`。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>基于 JS 的微型 Razor 引擎</title>
<script src="jquery-1.8.3.js"></script>
<script src="script/Razor.base.js"></script>
<script type="text/javascript">
$(function () {
var model = { id: 5, userID: 1, message: '基于 JS 的微型 Razor 引擎', date: Date.now() };
$.razorAll(model);
});
</script>
</head>
<body>
`helper test(index){ return index; }
`for(var index = 0;index < model.id; index++ ){
<span>`(">"+index)</span>
}
`if(model.userID == 1){
<h1>用户编号是1</h1>
}
`if(model.message){
<h2>`model.message</h2>
}
`if(model.date){
<h3>`model.date</h3>
}
</body>
</html>
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>基于 JS 的微型 Razor 引擎</title> <script src="jquery-1.8.3.js"></script> <script src="script/Razor.base.js"></script> <script type="text/javascript"> $(function () { var model = { id: 5, userID: 1, message: '基于 JS 的微型 Razor 引擎', date: Date.now() }; $.razorAll(model); }); </script> </head> <body> `helper test(index){ return index; } `for(var index = 0;index < model.id; index++ ){ <span>`(">"+index)</span> } `if(model.userID == 1){ <h1>用户编号是1</h1> } `if(model.message){ <h2>`model.message</h2> } `if(model.date){ <h3>`model.date</h3> } </body> </html>