<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button id="btn">点击</button>
<div id="box"></div>
<script src="common.js"></script>
<script>
var arr = [
{ names: "百度", href:"http://www.baidu.com", content: "哈哈"},
{ names: "淘宝", href:"http://www.taobao.com", content: "哈哈"},
{ names: "新浪", href:"http://www.sina.com", content: "哈哈"},
{ names: "京东", href:"http://www.jd.com", content: "哈哈"},
{ names: "京东", href:"http://www.jd.com", content: "哈哈"}
]
// console.log(arr[3].href);
//创建表格 四行两列
my$("btn").onclick = function () {
//判断如果有表格了,则终止后面的操作
if(my$("table")){
return false;// 终止后面的操作, 返回错误的结果
}
//1.创建table添加到div中
var tableObj = document.createElement("table");
tableObj.id = "table";
tableObj.border = "1";
tableObj.cellSpacing = "0";
my$("box").appendChild(tableObj);
//2.创建行并添加到table中
for(var i = 0 ; i < arr.length ; i++){
//每一个对象
var arrList = arr[i];
var trObj = document.createElement("tr");
tableObj.appendChild(trObj);
for(var key in arrList){
var tdObj = document.createElement("td");
//{ names: "百度", href:"http://www.baidu.com"},
tdObj.innerHTML = arrList[key];
trObj.appendChild(tdObj);
}
}
}
</script>
</body>
</html>
原文:https://www.cnblogs.com/Ironman725/p/10993350.html