请问这段javascript操作表格的代码为什么运行没有效果？

<!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>
<style type="text/css">
td{font-size:14px;width:80px;height:30px;text-align:center;border-bottom:1px solid #666;border-right:1px solid #666;}
table{border-left:1px solid #666;border-top:1px solid #666;}
body{text-align:center;}
input{margin-top:5px;}
</style>
<script type="text/javascript">
function checks(){

var tt=document.getElementById("myTable");
/*查找第二行第一个单元格内容*/

var s=tt.lastChild.firstChild.firstChild.innerHTML;
/*查找最后一行最后一个单元格内容

var s=tt.lastChild.lastChild.lastChild.innerHTML;

*/

/*查找最后一行第一个单元格内容

var s=tt.lastChild.firstChild.lastChild.innerHTML;*/
alert(s);
}
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0" id="myTable">

<thead>

<td>姓名</td>

<td>课程</td>

<td>成绩</td>
</thead>

<tbody>

<tr>

<td>欧阳兰</td>

<td>语文</td>

<td>88</td>

</tr>

<tr>

<td>白杨</td>

<td>数学</td>

<td>96</td>

</tr>

</tbody>
</table>
<input name="btn" type="button" value="第二行第一个单元格内容" onclick="checks()" />
</body>
</html>

举报该文章

相关建议 2015-04-10

你可以尝试在你的代码中alert(tt.lastChild.nodeName);

是不是#text？

因为取到了空白符，在html中空格、换行符等都别识别为空白符。

用lastChild、firstChild等获取节点时要注意，空白符也算节点，节点名为#text。

所以想要得到准确值的话，一定要把table中的换行和空格全部去掉。

如下

温馨提示：内容为网友见解，仅供参考

当前网址：https://22.t2y.org/zz/2fh62stt2t06hscfs2.html

其他看法

第1个回答 2015-04-10

<!DOCTYPE html>
<html>
  <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>
RunJS 演示代码
</title>
<style type="text/css">
td{
font-size:14px;
width:80px;
height:30px;
text-align:center;
border-bottom:1px solid #666;
border-right:1px solid #666;
}
table{
border-left:1px solid #666;
border-top:1px solid #666;
}
body{
text-align:center;
}
input{
margin-top:5px;
}
</style>
<script type="text/javascript">
function checks()
{
var tt = document.getElementById("myTable");
var rows = tt.tBodies[0].rows;
/*查找第二行第一个单元格内容*/
alert(rows[1].cells[0].innerHTML);
/*查找最后一行最后一个单元格内容 */
var cells = rows[rows.length - 1].cells;
alert(cells[cells.length - 1].innerHTML);
/*查找最后一行第一个单元格内容 */
alert(cells[0].innerHTML);
      }
</script>
  </head>
<body>
    <table border="0" cellspacing="0" cellpadding="0" id="myTable">
<thead>
<td>
姓名
</td>
<td>
课程
</td>
<td>
成绩
</td>
</thead>
<tbody>
<tr>
<td>
欧阳兰
</td>
<td>
语文
</td>
<td>
88
</td>
</tr>
<tr>
<td>
白杨
</td>
<td>
数学
</td>
<td>
96
</td>
</tr>
</tbody>
</table>
<input name="btn" type="button" value="第二行第一个单元格内容" onclick="checks()" />
  </body>
</html>

追问

谢谢，我想明白表格之间没有父子关系吗？为什么我那个代码使用firstchild属性没有出效果呢

请问这段动态网页代码(javascript)哪里有问题,就是实现不了效果
第一个问题，要在外面定义var ximage; var xtext; 你在function里面定义的ximage和xtext两个数组，在其他的function里面识别不到。第二个问题，你定义数组的array改成Array ，a改成大写的不然识别不到

js操作DOM,动态增加表格填数据,下面这段程序为什么不行
<!doctype html>动态的增加表格function addrow(){\/\/增加表格行的函数var tab=document.getElementById("mytab");\/\/取得table的节点对象var id=document.getElementsByName("id")[0].value;\/\/取得输入内容var name=document.getElementsByName("name")[0].value;\/\/var tr=document.createElement("t...

表格js代码(javascript表格代码)
\/\/使用string.toUpperCase()(将字符串中的字符全部转换成大写)或string.toLowerCase()(将字符串中的字符全部转换成小写)\/\/所谓忽略大小写的搜索就是将用户输入的字符串全部转换大写或小写，然后把信息表中的字符串的全部转换成大写或小写，最后再去比较两者转换后的字符就行了 \/***JS实现表格忽略大小...

用javascript做出这种效果的代码,三行三列就够了,谢谢!
回答：就如一楼,不过要是你只是做一个表格的话,用<table><\/table>就可以了

请问这段javascript 代码是什么意思?为什么能输出汉字。
如果 PreferredType是String，步骤2跟3互换，如果PreferredType没有，Date实例被设置成String，其他都是Number 2. 通过ToNumber()把值转换成Number，直接看ECMA 9.3的表格 3. 通过ToString()把值转化成字符串，直接看ECMA 9.8的表格规则就这么多，接下来实践一下，根据我们上面划分出的子表达式，一...

请问下边这段javascript代码让隐藏的表格显示出来哪里出错了?
function btnSearchOnClick() { var tableMain=document.getElementById("tableMain")for(var i=1;i<tableMain.rows.length;i++) { tableMain.rows[i].style.display="";} } 11 111 2 22<\/

请问这段JavaScript代码有什么错误?为什么显示结果是undefined
var sz=["all","links","images","anchors "];var len=sz.length;\/\/这里的分号不对。var j=0;for(var i=0;i<len;i++){ j=sz[i];document.write(j+"");\/\/这里j已经取到数组里面的值了。还有就是你那个sff.document？是什么东西。你只给了这点代码，我在里面调了几个地方，...

请教以下javascript代码为何无法实现生成表格后对选中行变色的功能?
} html += ""; document.getElementById("cs").innerHTML = html; \/\/把这些写到这里即可，去掉var表示全局变量，不然在还没有点击查询按钮时，无法获取，为空报错。 ipt = document.getElementById("查询表格").

表格无法编辑是怎么回事
JavaScript或CSS影响：错误的脚本或样式可能导致表格编辑功能受限。检查相关代码，确保它们不会干扰表格操作。浏览器兼容性：某些浏览器可能不支持HTML编辑功能。在开发时，务必测试在主流浏览器上的表现。理解并解决这些问题至关重要，因为表格的可编辑性直接影响用户体验和功能的正常运行。如果上述方法无效，...

JS操作表格(使用JAVASCRIPT控制HTML表格的增加、修改、删除)
这种表单建议你用bootstrap里面的组件有现成的行选中状态至于增删我的理解就是配好每一行的代码 jquery里面有相应的方法比如 remove（） append（）之类的可以看看

相似回答

大家正在搜