js 字符串拼接

小灰灰 2022-05-14 09:45 415阅读 0赞

**如下所示：**

[?][Link 1]

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 </td> 
 <td> <code>function</code><code>(msgArr) { </code> <code>&nbsp;&nbsp;</code><code>var</code> <code>len = msgArr.length;</code> <code>&nbsp;&nbsp;</code><code>var</code> <code>n = 0 ;</code> <code>&nbsp;&nbsp;</code><code>var</code> <code>htmlSpan = </code><code>""</code><code>;</code> <code>&nbsp;&nbsp;</code><code>for</code> <code>(</code><code>var</code> <code>j = 0; j &lt; len - 1; j++) { </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>htmlSpan += </code><code>'&lt;span&gt;·&lt;/span&gt;'</code><code>;</code> <code>&nbsp;&nbsp;</code><code>}</code> <code>&nbsp;&nbsp;</code><code>htmlSpan += </code><code>'&lt;span class="on"&gt;·&lt;/span&gt;'</code><code>;</code> <code>&nbsp;&nbsp;</code><code>var</code> <code>imgs = [];</code> <code>&nbsp;&nbsp;</code><code>var</code> <code>img = [];</code> <code>&nbsp;&nbsp;</code><code>img[0] = </code><code>'&lt;a href="'</code> <code>+ ctx + </code><code>'/webservice/dish/detail?id='</code><code>;</code> <code>&nbsp;&nbsp;</code><code>img[1] = </code><code>'#'</code><code>;</code> <code>&nbsp;&nbsp;</code><code>img[2] = </code><code>'"&gt;&lt;img src="'</code><code>;</code> <code>&nbsp;&nbsp;</code><code>img[3] = </code><code>'#'</code><code>;</code> <code>&nbsp;&nbsp;</code><code>img[4] = </code><code>'"&gt;&lt;/a&gt;'</code><code>;</code> &nbsp; <code>&nbsp;&nbsp;</code><code>for</code> <code>(</code><code>var</code> <code>i = 0; i &lt; len; i++) { </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>img[1] = msgArr[i].id;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>img[3] = msgArr[i].pic;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>imgs.push(img.join(</code><code>""</code><code>));</code> <code>&nbsp;&nbsp;</code><code>}</code> <code>&nbsp;&nbsp;</code><code>$(</code><code>"#banner_list"</code><code>).html(imgs.join(</code><code>""</code><code>));</code> <code>&nbsp;&nbsp;</code><code>$(</code><code>".dots"</code><code>).html(htmlSpan);</code> <code>}</code> </td> 
 </tr> 
 </tbody> 
</table>

上面的代码取自我最近写的一个脚本，在这个函数中，正好体现了两种js拼接字符串从而为DOM添加新元素，第一种方法是直接相加，第二种是利用数组的join()方法进行拼接，第二种效率要高些

[Link 1]: https://www.jb51.net/article/91785.htm#