这是个经典的创建表哥的例子,里面有json格式,利用for循环生成表格,其中涉及到嵌套创建元素等知识,值得收藏!
<script type="text/javascript" src="J.js"></script>
<script type="text/javascript">
// json格式的字符串
var str = '[{name:"赵晓虎",sex:"男",age:19},{name:"牛亮亮",sex:"男",age:29},{name:"杨中科",sex:"男",age:39}]';
onload = function() {
// 生成一个table,然后追加到body中
// 一开始就需要生成一个table
// 里面遍历json对象生成里面的tr
// 每一个json对象中的每一个成员(for-in)得到td标签
// 1、生成table
var table = document.createElement("table");
table.border = "1";
// 2、得到json格式的对象
var jsons = new Function("return " + str)();
// 3、循环这个数组
for(var i = 0; i < jsons.length; i++) {
// 4、生成每一个行
// 创建tr标签
var tr = document.createElement("tr");
// 5、添加td,就需要遍历每一个对象中的成员
for(var k in jsons[i]) {
// 6、创建td
var td = document.createElement("td");
td.appendChild(document.createTextNode(jsons[i][k]));
// 7、追加td
tr.appendChild(td);
}
// 循环结束,就得到一个行
// 将行追加到table
table.appendChild(tr);
}
// 将table加到body中
document.getElementsByTagName("body")[0].appendChild(table);
var _ = 0;
};
</script>