Handlerbar.js——Ajax组装html的超强模板工具学习实践

本文介绍了Handlerbar.js作为Ajax组装HTML的模板工具的优势,它结合了保持HTML格式和快速响应的优点。内容包括Handlerbar.js的基础使用,如each循环和if判断,以及Helper方法注册。此外,还提供了学习资源链接,帮助开发者进一步掌握Handlerbar.js。
摘要由CSDN通过智能技术生成

一、背景介绍

在JSP页面开发中,关于页面中html代码的组建方式有两种:

1、在JSP页面使用jsp<%%>语言或<c:each>等标签进行组建,优点:保持html原有格式,缺点:占用大量服务器资源,而且速度缓慢;

2、通过Ajax请求返回json对象,for循环等进行html代码组建,优点:反应速度非常快,用户体验非常好,缺点:无法html原有格式

在这里,推荐后者,因为服务器端只需要提供一个json串,由客户端完成解析,因此服务器承受的压力很小,目前的电脑配置都较高,客户端的浏览器解析js脚本很快,因此页面体验效果好。

然而,后者在组装html代码字符串的时候,会十分痛苦,如下:

 
 1 var contractTextHtml="";
 2 $.each(jsonObject.cl,function(i,n){
 3   
 4   contractTextHtml="";
 5   
 6   //插入合同文本数据
 7   contractTextHtml+="<div title='出借人信息---"+hiddenNull(n.cm.lenderName)+"' style='overflow:auto;padding:5px;'>";
 8   contractTextHtml+="<table class='ui-table ui-table-noborder'>";
 9   contractTextHtml+="<tbody>";
10   contractTextHtml+="<tr><td>合同编号:</td><td><p>"+hiddenNull(n.cm.contractId)+"</p></td></tr>";
11   contractTextHtml+="<tr class='ui-table-split'><td>出借人姓名:</td><td><p>"+hiddenNull(n.cm.lenderName)+"</p></td></tr>";
12   contractTextHtml+="<tr><td>出借人证件类型:</td><td&g
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值