正常建立表格,我们都是先建立一个表头,然后再建立一个表的主题;

当我们查找表格里面东西的时候,用getElementById()和getElementsByTagName(“xxx”)[0]这样的语法来做,但是表格中有特殊的一些语法是可以简便实用的;因为js是90年代出来的,那时候的网站用的很多都是tab标签来做的,div和CSS并没有多少被人提起,所以唯独table有便捷的语法;

 

常规我们弹出一个表格内容的时候,用下面的代码:

(写表格的时候也可以不写tbody的,也可以正常运行的,即使你不写tbody,浏览器也会给你加上,所以最好写上去,这样用代码的时候引用比较明显,显得不乱;)

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
window.onload= function () {
var oTab=document.getElementById('tab1')
alert(oTab.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[1].getElementsByTagName('td')[1].innerHTML);
};
</script>
</head>
<body>
<table id="tab1" border="1px" width="500px">
<thead>
<td>ID</td>
<td>name</td>
<td>ages</td>
</thead>
<tbody>
<tr>
<td>1</td>
<td>broszhu</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>zhu</td>
<td>22</td>
</tr>
<tr>
<td>3</td>
<td>smile</td>
<td>22</td>
</tr>
<tr>
<td>4</td>
<td>bro</td>
<td>25</td>
</tr>
<tr>
<td>5</td>
<td>alice</td>
<td>25</td>
</tr>
<tr>
<td>6</td>
<td>alian</td>
<td>26</td>
</tr>
</tbody>
</table>

</body>
</html>

其中的引用代码:

//alert(oTab.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[1].getElementsByTagName('td')[1].innerHTML);};

可以换成:

alert(oTab.tBodies[0].rows[1].cells[1].innerHTML);};//简写方法;

这样的写法,会更加的简易;···.

表格获取代码:

tBodies、tHead、tFoot、rows 、cells

其中tHead、tFoot是单数,其它的复数;因为thead和tfoot各只有一个的;