js中的rows和cells的使用

最新推荐文章于 2023-02-17 17:19:05 发布

最新推荐文章于 2023-02-17 17:19:05 发布 · 417 阅读

文章标签：

#java

本文介绍了如何使用JavaScript操作DOM中的表格元素，特别是tbody对象。tbody提供了方便的行列操作方式，可将其视为二维数组进行处理。文章还展示了如何通过getElementById获取特定的tbody，并通过其rows和cells属性修改表格内容。

部署运行你感兴趣的模型镜像

在使用JS时，经常会使用操作DOM树的方法来实现对HTML页面的修改，但在读取表格控件时，有一种简单的方法，就是通过获取tbody对象，此对象将行列的操作，作为二维数组来操作。

从网络中找到了些描述：

Table下面可以有thead和tbody两个分组对象，某些时候可以代替div使用，比如实现某部份表格隐藏。

tr是行，th或者td是列，这些对象构成表格阵列

每一个...就是我们所说得rows[id]

每一个...或者...就是cells[id]了

对于使用table来作为整个分组，我个人更喜欢tbody来代替table.

在table生命周期，只要我们知道tbody预设的id,我们就可以通过以下js代码获得这个tbody

document.getElementById(tbodyID);

js是弱类型语言，我们可以通过var一个对象来作为这个tbody的标记,然后就可以引用rows和cells了

var tbodyObj = document.getElementById(tbodyID);

tbodyObj.rows[rowID].cells[colID].innerText = "abcd";

tbodyObj.rows[rowID].cells[colID].innerHTML = "abcd

(innerHTML是指html代码，innerText是指显示的text);