日期:2014-05-16  浏览次数:20318 次

js动态创建table

<html>
<head> <title>Test javascript method </title>

<body>
<script language="javascript">
 function LoadData() {
  var data = {"腾讯":"http://www.qq.com","百度":"http://www.baidu.com","新浪":"http://www.sina.com"};
	var table = document.createElement("TABLE");
	table.setAttribute("id","tableId");
	var tbody = document.createElement("TBODY");
	var tr = document.createElement("TR");
	var td = document.createElement("TD");
	var text = document.createTextNode("text");
	td.appendChild(text);
	tr.appendChild(td);
	tbody.appendChild(tr)
	table.appendChild(tbody);
	table.appendChild(tr);
	document.body.appendChild(table);
	var tableLinks = document.getElementById("tableId");
for(var key in data){
  var value = data[key];
    
  tr = tableLinks.insertRow(-1);
  var td1 = tr.insertCell(-1);
  td1.innerText =key;
    
  var td2 = tr.insertCell(-1);
  td2.innerHTML = "<a href='"+value+"'>" +value+ "</a>";
  }
}
</script>
<input type="button" value="创建表格" onclick="LoadData()" /></body>
?