<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div{
width: 300px;
height: 300px;
border: 1px solid red;
}
</style>
</head>
<body>
<input type="button" value="点我" id="btn">
<div id="dv"></div>
<script src="common.js"></script>
<script>
var arr = [
{name: "百度", href: "http://www.baidu.com"},
{name: "谷歌", href: "http://www.google.com"},
{name: "淘宝", href: "http://www.taobao.com"},
{name: "京东", href: "http://www.jd.com"}
];
console.log(arr[3].href);
my$("btn").onclick = function () {
if(my$("dv").innerHTML==""){
var table = document.createElement("table");
table.border = "1";
table.cellSpacing = "0";
my$("dv").appendChild(table);
for (var i = 0; i < arr.length; i++) {
//创建表行
var tr = document.createElement("tr");
//追加父元素
table.appendChild(tr);
var td = document.createElement("td");
tr.appendChild(td);
td.innerHTML = arr[i].name;
td.innerHTML = arr[i].name;
var td2 = document.createElement("td");
tr.appendChild(td2);
td2.innerHTML = "<a href=" + arr[i].href + ">" + arr[i].name + "</a>";
}
}
}
</script>
</body>
</html>
添加table元素
最新推荐文章于 2022-11-28 16:14:44 发布