js如何想表格的倒数第二行插入数据

 时间:2024-10-13 14:02:51

1、搭建测试环境打开记事本,输入以下代码:<html> <head> <meta charset="utf-8"> <title>花名册</title> </head> <body> <br/><br/> <center> <table border="1" width=400px > <tr> <th>姓名</th><th>性别</th><th>年龄</th> </tr> <tr align=middle> <td>刘二</td><td>男</td><td>18</td> </tr> <tr align=middle> <td>张三</td><td>男</td><td>16</td> </tr> <tr align=middle> <td>李四</td><td>女</td><td>20</td> </tr> <tr align=middle> <td>王五</td><td>男</td><td>19</td> </tr> </table> </center> </body></html>保存成网页文件test.html。如不清楚如何保存,请查看下面经验"创建网页"部分。

js如何想表格的倒数第二行插入数据

2、双击打开test.html,浏览器中运行效果如下图所示:

js如何想表格的倒数第二行插入数据

3、获取表格的总行数在网页代码</body>标签后加入以下代码: <script language=javascript> var row; row=document.getElementsByTagName('tr').length; alert("表格总行数为:"+row); </script>其中row就是用javascript脚本获取到的表格总行数,而row-2就是表格中倒数第二行在document.getElementsByTagName('tr')数组中的index。

js如何想表格的倒数第二行插入数据

4、获取表格倒数第二行的html内容通过以下语句可获取表格倒数第二行的html内容。document.getElementsByTagName('tr')[row-2].innerHTML;效果如图所示:

js如何想表格的倒数第二行插入数据

5、替换整行html内容实现单元格值修改即然我们能够获取表格倒数第二行的html代码内容,我们也能够通过设置倒数第二行的html代码内容来实现更改其单元格中的值。如:document.getElementsByTagName('tr')[row-2].innerHTML="<td>赵七</td><td>女</td><td>18</td>"

js如何想表格的倒数第二行插入数据

6、定位单元格进行值修改如果你只想修改某一单元格的值,还可以修改代码如下:document.getElementsByTagName('tr')[row-2].children[0].innerHTML="孙大圣";children[0]表示第一个单元格对象。如果要修改其它单元格,只需修改方括号的数字即可。

js如何想表格的倒数第二行插入数据

7、多个表格的处理如果有多个表格,则可以通过document.getElementsByTagName('table')[?]来定位表格,或给表格添加一个id然后利用document.getElementsById('tableID')来定位表格。如:document.getElementsByTagName('table')[0].getElementsByTagName('tr')[row-2].children[0].innerHTML="孙大圣1";

js如何想表格的倒数第二行插入数据
  • Excel VBA消息框怎样换行显示?
  • 肌肉疼痛是怎么回事
  • 图示EXCEL表格vba系列72之xlEdgeBottom属性简介
  • Excel中address函数的用法
  • 在js里面怎样获取一个值的前4位?
  • 热门搜索
    百善孝为先手抄报内容 名人手抄报图片 关于爱鸟护鸟的手抄报 生活中的数学手抄报 消防手抄报内容 有关运动会的手抄报 手抄报小插图 关于龙的手抄报 节约粮食手抄报图片 消防的手抄报