Question

我想知道如何才能在表格中获得某个标题值，只需找出点击了哪个单元格。

我知道我可以得到像这样的单元格值：

var table = document.getElementById('mytbl'),
cells = table.getElementsByTagName('td');

for (var i=0,len=cells.length; i<len; i++){
    cells[i].onclick = function(){
        console.log(this.innerHTML);

但我怎么能让它读取标题值。

例如，如果单击b2，我想获取x2值，如果单击a3，我想要x3值等...

x1 x2 x3
a1 a2 a3
b1 b2 b3

感谢您的帮助。

Answer 1

您可以使用cellIndex

var table = document.getElementById('mytbl'),
cells = table.getElementsByTagName('td');
for (var i = 0, len = cells.length; i < len; i++) {
  cells[i].onclick = function () {
    var th= table.getElementsByTagName('th')[this.cellIndex];
    console.log(th.innerHTML);
  }
}

Demo

Answer 2

您可以像这样使用一个处理程序。 Demo

var table = document.getElementById('mytable');

table.addEventListener('click', function(e) {
    var position = e.target.cellIndex, //clicked td index if any

        header = position !== undefined && table.rows[0].cells[position].innerHTML; 
       //first row at pos.    

    if(!header) return;

    console.log(header);        
});

从所选（单击）单元格中读取表格标题值

2 个答案:

Demo