DOM在表格中的应用

最新推荐文章于 2023-12-22 16:20:30 发布

jaray

最新推荐文章于 2023-12-22 16:20:30 发布

阅读量685

点赞数

分类专栏： js

js 专栏收录该内容

60 篇文章 0 订阅

订阅专栏

<!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>
window.οnlοad=function(){
	var oBj=document.getElementById('tab1');

	//alert(oBj.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[3].getElementsByTagName('td')[1].innerHTML);
	
	
	alert(oBj.tBodies[0].rows[3].cells[1].innerHTML);//tBodies代表tdody表格元素，rows代表tr标签元素，cells代表td标签元素，此语句跟上面那种意思表达相同
};
</script>
</head>

<body>
<table border="1" id="tab1" width="400">
<thead><td>ID</td><td>姓名</td><td>操作</td></thead>
<tbody>
<tr><td>一行一列</td><td>一行二列</td><td>一行三列</td></tr>
<tr><td>二行一列</td><td>二行二列</td><td>二行三列</td></tr>
<tr><td>三行一列</td><td>三行二列</td><td>三行三列</td></tr>
<tr><td>四行一列</td><td>四行二列</td><td>四行三列</td></tr>
<tr><td>五行一列</td><td>五行二列</td><td>五行三列</td></tr>
<tr><td>六行一列</td><td>六行二列</td><td>六行三列</td></tr>
</tbody>
</table>
</body>
</html>