JS 动态添加Table行

最新推荐文章于 2021-08-21 16:43:24 发布

cjh200102

最新推荐文章于 2021-08-21 16:43:24 发布

阅读量508

点赞数

文章标签： table website button function xhtml input

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
< html xmlns= "http://www.w3.org/1999/xhtml ">
<head >
    <title ></title >
    < script type= "text/javascript ">
        var data = { "123 ": ["http://www.123.com "], "kaixin ": ["http://www.kaixin001.com "] };
        window.onload = function () {
            var table = document.createElement("table");
            table.border = "1 ";
            table.id = "table1 ";
            document.body.appendChild(table);
        };
        function addweb() {
            var table = document.getElementById("table1 ");
            for (var website in data) {
                var tr = document.createElement("tr ");
                var td1 = document.createElement("td ");
                var td2 = document.createElement("td ");
                td1.innerHTML = website;
                td2.innerHTML = "<a href=' " + data[website] + "'> " + data[website] + "</a> ";
                tr.appendChild(td1);
                tr.appendChild(td2);
                table.appendChild(tr);
            }
        }
    </script >
</head >
<body >
    < input type= "button " id= "Button2 " value= "增加网站 " οnclick= "addweb() " />
</ body >
</ html >