在我们写前后端交互时，最反感的可能就是拼接大量图表的工作了（html += "xxxxxxxxx...." ），记得之前写一个“急”页面，有大量的js拼接内容（类似今日头条APP的检索页面），拼接代码写了几千行。知道么，我是流着泪加班写完的。
因此，对于JS拼接HTML的引用变量，我总结了几个常见的情况；
1.int类型，可以直接进行拼接
var intA = 5;
html += '<span class="m-t-xs" ng-click="open(' + intA + ')"></span>';2.字符串类型，需要加上引号（以及转义引号的转义君： \ ）
var strB = '娘炮蔡虚坤';
html += '<span class="m-t-xs" ng-click="open(\'' + strB + '\')"></span>';3.对象。知道么，对象是不能通过js直接拼接到html中的（html解析器只能解析字符串）。拼接的必须是字符串。对象 --> 字符串。
var objectC = {"icon": "蔡虚坤唱跳rap.jpg.", "name": "蔡虚坤", "sex": "??", "地址": "CN"};
html += '<span class="m-t-xs" ng-click="open(\'' + objectC + '\')"></span>';如果直接使用对象进行拼接。触发事件时会得到（[onject Object]）无法解析。或引起Uncaught SyntaxError: Unexpected identifier错误。
处理方法：
1.将对象各属性拆开，分成一个方法的多个参数进行传递。（推荐）
#为什么推荐方法1呢？因为参数啥样的都有，十分的杂，如果放在一起，出现错误后很难排查问题，或许会闪瞎我们的铝合金gou眼（如下），已吐。
2.设置全局变量（多循环情况需考虑效率问题）
3.将对象通过JSON.stringify()转成JSON字符串拼入html。然后取得时候在用JSON.parse(str)或eval(str)将转成JSON对象处理；
方法3可能出现的问题（报错）：
1.Lexer Error: Unterminated quote at columns 11-13 ['{] in expressio... 说明字符串中有 ' 符号与与拼接的 '' 发生冲突了。
可以把字符串中的 ' 去掉（replace()），或提前把 ' 符号替换成 & 或类似的特殊符号，取值时加一个预处理程序即可。
2.但是在转换过程中，可能会出现unexpected end of input错误。改错误是因为json字符串的双引号和oncilck的双引号冲突。需要将json字符串转成单引号字符串。
双引号转成单引号 JSON.stringify(data).replace(/\"/g,"'");
