用JS添加tr和td？

is668com 2012-09-24 08:24:10



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

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javacript">

var tableTag=document.getElementById("table");

 for(var i=0;i<=5;i++)

 {

  var trTag=document.createElement("tr");

  

  for(var j=0;j<=5;j++)

  {

   var tdTag=document.createElement("td");

   var divTag=document.createElement("div");

   divTag.innerHTML="11";

   tdTag.appendChild(divTag);

   trTag.appendChild(tdTag);

  }

  tableTag.appendChild(trTag);

 }

</script>

</head>



<table id="table" border="1">

</table>

</body>



</html>

...全文

166 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

cscript 2012-09-25

打赏
举报

[Quote=引用 3 楼的回复:]

引用 1 楼的回复:

<!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>
<met……
[/Quote]

其中 inserRow 为表格添加行
insertCell 为行添加单元格

cscript 2012-09-25

打赏
举报

[Quote=引用 1 楼的回复:]

<!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>
<meta http-equiv="C……
[/Quote]

1楼的只支持非ie的浏览器，楼主要支持所有浏览器的话

表格tr 和 td 添加需要用到 insertRow 和 insertCell 这两个方法

例子如下



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

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>这种方法兼容所有浏览器</title>

<script type="text/javascript">

window.onload = function(){

	var oTable=document.getElementById("table");

	 for(var i=0;i<=5;i++)

	 {

		var oRow = oTable.insertRow(i);

		for(var j=0;j<5;j++){

			var oTr = oRow.insertCell(j);

			oTr.innerHTML = j;

		}

	 }

}

</script>

</head>

<body>

<table id="table" border="1">

</table>

</body>



</html>

is668com 2012-09-25

打赏
举报

哥们我加了一个onload="a()"还是显示不出来呢，，对照我的和上面这个看了半天也找不到哪里不一样了

littlebaby0727 2012-09-24

打赏
举报

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function a(){
var tableTag=document.getElementById("table");
for(var i=0;i<=5;i++)
{
var trTag=document.createElement("tr");

for(var j=0;j<=5;j++)
{
var tdTag=document.createElement("td");
var divTag=document.createElement("div");
divTag.innerHTML="11";
tdTag.appendChild(divTag);
trTag.appendChild(tdTag);
}
tableTag.appendChild(trTag);
}
}
</script>
</head>
<body onload="a()">
<table id="table" border="1">
</table>
</body>

</html>