【问题标题】:Javascript get the text value of a column from a particular row of an html tableJavascript 从 html 表的特定行中获取列的文本值
【发布时间】:2012-05-19 23:51:39
【问题描述】:

用户点击表格的一行,我想(在 Javascript 中)获取该行的第 3 列的 innerhtml。

类似:

document.getElementById("tblBlah").rows[i].columns[j].innerHTML

似乎无法实现,我在这里或网上都找不到任何东西。

非常感谢任何解决方案(没有 jQuery)

【问题讨论】:

  • 除了总计 colspans 之外,任何人都知道确实是列而不是单元格?

标签: javascript html html-table row


【解决方案1】:
document.getElementById("tblBlah").rows[i].columns[j].innerHTML;

应该是:

document.getElementById("tblBlah").rows[i].cells[j].innerHTML;

但我有一个明显的印象,即您需要的行/单元格是用户点击的那个。如果是这样,实现此目的的最简单方法是将事件附加到表格中的单元格:

function alertInnerHTML(e)
{
    e = e || window.event;//IE
    alert(this.innerHTML);
}

var theTbl = document.getElementById('tblBlah');
for(var i=0;i<theTbl.length;i++)
{
    for(var j=0;j<theTbl.rows[i].cells.length;j++)
    {
        theTbl.rows[i].cells[j].onclick = alertInnerHTML;
    }
}

这使得所有表格单元格都可以点击,并提醒它是innerHTML。事件对象将被传递给alertInnerHTML 函数,其中this 对象将是对被单击单元格的引用。事件对象为您提供了许多巧妙的技巧,让您了解单击事件的行为方式,例如,如果单元格中有一个被单击的链接,但我建议检查 MDN 和 MSDN(对于 window.event 对象)

【讨论】:

    【解决方案2】:

    如果你的桌子有 tbody

    let tbl = document.getElementById("tbl").getElementsByTagName('tbody')[0];
    console.log(tbl.rows[0].cells[0].innerHTML)
    

    【讨论】:

      【解决方案3】:

      获取html代码:

      document.getElementById("table").rows[i].cells[j].innerHTML;
      

      获取文本:

      document.getElementById("table").rows[i].cells[j].innerText;
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2020-10-02
        • 1970-01-01
        • 2018-03-01
        • 1970-01-01
        • 2021-05-09
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多