是否有动态添加标签更好的方法

Question

AJAX获取到的数据需要动态的添加标签到页面中，于是有了这种代码

var CreatLi = data => '<img src="' + data.smallPhotoUrl +
        '"alt="' + data.name +
        '" width="50" height="50"><div><p>' + data.name +
        '</p><img src="img/learnerCount.png" height="11" width="9"/>&nbsp;<span>' + data.learnerCount +
        '</span></div>'

有没有更好的解决方法？一看就知道添加了什么标签，标签里有什么属性的那种，而且还不繁琐。
用createElement的话代码会变很多。

Answer 1

可以使用 ``
例：

`<img src="${data.smallPhotoUrl}" alt="${data.name}" width="50" height="50" />`

Answer 2

利用模板， 网上有很多模板库。

比如： https://github.com/yanhaijing...

这个也不错： https://github.com/lhywork/ar...

Answer 3

可以参考下我写的jQTips·动态添加元素的清爽写法，当然你这个情况复杂一点，可以考虑直接append一个jQ对象数组……

Answer 4

也可以利用前端的模板来达到你说的目的；拿来就可以用，像Template等等。