<!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