JS如何实现获取表格中的单元格里面的数据,并让其累加
2016-11-29 11:38
666 查看
<table id="thetable" border="1" cellspacing="1" cellpadding="7" width="50%"> <caption>Sunyanzi's Test</caption> <tbody> <tr><td>1</td><td>2</td></tr> <tr><td>3</td><td>4</td></tr> <tr><td>5</td><td>6</td></tr> <tr><td>7</td><td>8</td></tr> <tr><td>9</td><td>10</td></tr> <!-- the row below is used to fill sum data ... --> <tr><th></th><th></th></tr> </tbody> </table> <script type="text/javascript"> /* get our table ... */ var table = document.getElementById( "thetable" ); /* last line not contain data ... kick it out ... */ var totalRows = table.rows.length -1; /* initialize two variables as basket ... */ var firstColumn = secondColumn = 0; /* traverses from first row to last ... */ for ( var i = 0; i < totalRows; ++ i ) { /* add new value to our basket ... */ firstColumn += Number( table.rows[i].cells[0].innerHTML ) || 0; secondColumn += Number( table.rows[i].cells[1].innerHTML ) || 0; } /* put the result in last row ... */ table.rows[i].cells[0].innerHTML = firstColumn; table.rows[i].cells[1].innerHTML = secondColumn; </script>
首先是表格中的
rows和
cells数组
... 第一个元素的索引都是 0 而不是 1 ...
比如表格的第一行 ... 应该是
i = 0而不是
i = 1...
第一列和第二列 ... 应该是
cells[0]和
cells[1]而不是
cells[1]和
cells[2]...
以及你用到了 innerText ... 在 Gecko 内核的浏览器上是没有这个属性的 ...
Gecko 上类似的属性叫 textContent ... 当然其他浏览器也不支持 ...
所以当你的
td标签中只包含数字不包含其他 HTML 标签的时候 ...
完全可以用兼容性更好的
innerHTML来处理
相关文章推荐
- html 如何获取表格中所选行的一行数据,并赋值到对应的TEXT里面?
- 原生js如何实现柱状图以及原生js柱状图结合ajax循环动态数据_JavaScript_柱状图(原生JavaScript做的柱状图)(03)_ajax获取数据
- JSP/JS获取表格当前行行号及行每一个单元格数据
- js实现表格的增删改,并获取表格中的数据传递到后台中。
- 讲解如何让 ASP.NET 实现获取xxxxxx rank值的代码数据
- html页面中,表格数据可以固定表头,表数据部分做滚动条显示,如何实现
- JS获取一行2列的表格数据
- 用JS获取表格单元中的数据
- js 动态表格 可以实现增删改查数据
- 在gridview模板列批量获取文本框的值(在JS如何实现)
- 关于JQuery获取表格中任意单元格的数据问题
- 如何在tableviewcell里面嵌入switch控件以及如何获取switch控件数据
- 关于Excel操作编写的一个软件设计构思案例[连载] --如何打开Excel文件,获取需要列的数据显示到表格内做修改
- ajax实现异步获取数据 (js创建ajax对象)
- 如果在一个KeyFigure的Rule里面,使用另外一个KeyFigure的数据,如何实现?
- js对表格行进行操作.获取单元格的值等
- js里面如何获取网络地址的图片的高度和宽度 (变通办法)
- JS如何获取A标签里面的链接属性
- 如何使用递归实现数据的累加
- 表格的JS操作 以及 表格中 JSON 数据的获取