js循环拼接字符串的替代方法有哪些？

Question

比如商品列表

<li>
    <img src='../../tu.png'/>
    <div>商品售价：12元</div></li>

我以前用jquery写的时候是，把这个li拼接字符串，然后循环图片数组，循环拼接li字符串。最后把循环出来的li字符串append到页面的ul里。
请问还有哪些方法能更好的方法代替这种循环拼接字符串啊，一旦li里面的结构复杂了，循环拼接字符串就会很蛋疼。我看h5有个新增的template标签，但是我循环图片数组append模板时，发现最终只能append一个li进去