字符串的拼接方法

數據交互常見的字符串拼接

博主最近事情有點忙，趁如今有點空閒時間，來總結一下工做中遇到的字符串拼接問題。說到字符串的拼接無外乎一下幾種方式：

1.經過'+'進行拼接

var arr =['今天',昨天','明天'];
$(
    '<div class="show">'+
        '<ul class="app">'+
            '<li>'+arr[0]+'</li>'+
            '<li>'+arr[1]+'</li>'+
            '<li>'+arr[2]+'</li>'+
        '</ul>'+
    '</div>'
).appendTo('.bo')//建立新的節點並插入到.bo

這種方法你們最經常使用，可是有個很差的就是 本身在作模版的時候，經常會由於少寫或者多寫分號而出錯，並且這種出錯不易察覺，時常會浪費不少寶貴的時間。

2.經過數組去拼接

var arr =['今天','昨天','明天']；
var str ='';
str+=['<div class="show">',
        '<ul>',
            '<li><a href="">'+arr[0]+'</a></li>',
            '<li><a href="">'+arr[1]+'</a></li>',
            '<li><a href="">'+arr[2]+'</a></li>',
        '</ul>',
    '</div>'
].join('');
$('.bo').append(str);

這種方式顯得高大上一些，並且使用的頻率也很是大。博主常常會使用這種方式，由於這種方式不容易出錯，及時出錯了也能夠立馬發現錯誤。

3.最近新學的一種字符串拼接方式，比前面兩種方式顯得更爲簡潔一些

var dataList = '<div id="box">\
<ul class="LearnList">\
<li class="list">HTML</li>\
<li class="list">CSS</li>\
<li class="list">JS</li>\
<li class="list">NODE</li>\
<li class="list">ANGLUAR</li>\
<li class="list">JSON</li>\
</ul>\
</div>'

第三種方法比較靈活，這種方式要注意一點，也是實現的關鍵：每一行的最後，都加上轉義斜線，但沒有後續字符，只有個。

好了，夜深了 博主也要擼一局睡覺了，有機會你們進羣裏探討啊 web前端開發 474471759。