js 关于insertCell()后隐藏列的innerHTML无法取得?
我要做的内容是添加一行后,然后复制上一行的各个单元格的内容,可是现在问题是:当TD的style.display= "none "后,这个单元格内的innerHTML就没法取得,请问什么原因?
<!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-Language " content= "zh-cn " />
<meta http-equiv= "Content-Type " content= "text/html; charset=utf-8 " />
<title> 无标题 1 </title>
</head>
<body>
<table style= "width: 100% " border= "1 " id= "tb1 ">
<tr>
<td> 11 </td>
<td> 22 </td>
<td> 33 </td>
<td> 44 </td>
<td style= "display: none; text-align: center; vertical-align: middle; "> 55 </td>
<td style= "display: none; text-align: center; vertical-align: middle; "> 66 </td>
</tr>
</table>
<input name= "Button1 " type= "button " value= "按钮 " onclick= "aa() " />
</body>
</html>
<script language= "javascript " type= "text/javascript ">
function aa()
{
debugger;
var obj=document.getElementById( "tb1 ");
obj.insertRow(1);
for(var i=0;i <obj.rows[0].cells.length;i++)
{
obj.rows[1].insertCell(i);
obj.rows[1].cells[i].innerHTML=obj.rows[0].cells[i].innerHTML;
obj.rows[1].cells[i].style.display=obj.rows[0].cells[i].style.display;
}
alert(obj.innerHTML);
}
</script>
------解决方案--------------------function aa()
{
var obj=document.getElementById( "tb1 ");
var row = obj.insertRow();
var ornalRow = obj.rows[0];
for(var i=0;i <ornalRow.cells.length;i++)
{
var cell = document.createElement( "td ");
cell.style.display=ornalRow.cells[i].style.display;
cell.innerHTML=ornalRow.cells[i].innerHTML;
row.appendChild(cell);
}
alert(obj.innerHTML);
}