HTML代码转换JavaScript后动态数据绑定以及常用写法

HTML代码转换JavaScript后动态数据绑定以及常用写法

注意：双引号、单引号、反斜杠的合理使用很重要！！！

1.js

function Down(ele) {
    alert(ele);
}
var datas = [
{
    imgurl: "http://manage.hbjk114.com//Files/ProductInfo/20170623143338252.jpg",
    text: "123",
    id: "0001"
},
{
    imgurl: "http://manage.hbjk114.com//Files/ProductInfo/20170623143338252.jpg",
    text: "123123",
    id: "0002"
},
{
    imgurl: "http://manage.hbjk114.com//Files/ProductInfo/20170623143338252.jpg",
    text: "123123123",
    id: "0003"
}];
var str = "";
str += ("<ul>");
var strr = "";
for (var i = 0; i < datas.length; i++) {
    strr += ("	<li>");
    strr += ("		<a href=\'#\' onclick=\'Down(" + '"' + datas[i].id + '"' + ")\'>");
    strr += ("			<img src=\'" + datas[i].imgurl + "\' />");
    strr += ("		</a>");
    strr += ("		<div class=\'guapi\'>" + datas[i].text + "</div>");
    strr += ("	</li>");
}
str += strr;
str += ("</ul>");
$("body").append(str);

效果：