JS拼接HTML方法以及注意事项

在日常开发中如果使用ajax进行异步刷新页面局部数据，会常用到JS来拼接HTML模块页面。在拼接过程中，尤其注意函数，变量的拼接处理。以下用JS来实现拼接目标页面块：

目标展示页面块：（以一个需要刷新的table为例）

后台处理hashMaps (List)集合，转化为JSONArray,返回给前端ajax回调函数

前端调用的JS方法，根据回调函数返回值拼接table内容，实现刷新：

一.首先定义data来拼接table页面中数据展示块，也就是 图一 foreach循环遍历的数据块。

仔细注意函数及其内部参数的拼接，如图所示，这个很重要，不然你拼接后的函数很有可能不能用。

二.然后紧接着拼接table的头部项，定义show拼接，最后把data加入到show内部，完成table数据刷新。

注意：这里关于data拼接到show的方式，可能有人会直接把拼接data的for循环直接加到show里，来完成拼接。我亲测过是不行的，必须分开写完成组合拼接。

这里也稍微介绍了一下怎么样将 List(hashMap) 转化为 JsonArray,对于返回的Json数组怎么样进行数据读取的操作。最后如果读者有更好的办法，欢迎留言探讨，谢谢。