在我們寫前後端交互時，最反感的可能就是拼接大量圖表的工作了（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,"'");