首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > JAVA > Java面试 >

用JS增添tr和td

2012-12-21 
用JS添加tr和td?!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR

用JS添加tr和td?


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


[解决办法]
<!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>

[解决办法]
哥们我加了一个onload="a()"还是显示不出来呢,,对照我的和上面这个看了半天也找不到哪里不一样了
[解决办法]
引用:
<!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……


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>


[解决办法]
引用:
引用:

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


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

热点排行