Question

我正在编写一个程序，它将生成一组HTML表，每个表都有一个（显然）唯一ID。每个表中的某些单元格具有onClick处理程序（并且每个单元格还具有唯一的ID）。我希望能够在单击一个单元格时获取表格id，以将其用作我正在调用onClick的函数中的参数。

之前已经问过这个问题（和answered）专门针对JQuery，但我更愿意在纯JavaScript中进行。我认为它一定是可能的，但是怎么样？

Answer 1

请尝试以下方法：

＆＃13;

var tds = document.getElementsByTagName("td");

var getParentTableID = function() {
    var el = this;
    while ((el = el.parentElement) && el.nodeName.toUpperCase() !== 'TABLE');
    console.log(el.id);//Table id
};

for(var i = 0; i < tds.length; i++) {
  tds[i].onclick = getParentTableID;
};

＆＃13;

<h4>Table1</h4>
<table id="tableID_1">
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>4</td>
    <td>5</td>
    <td id="b3">6</td>
  </tr>
  <tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
  </tr>
</table>
<h4>Table2</h4>
<table id="tableID_2">
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>4</td>
    <td>5</td>
    <td id="b3">6</td>
  </tr>
  <tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
  </tr>
</table>

＆＃13;

Answer 2

试一试：

<table id="Test">
  <tr>
    <td onclick="test(this)">teste</td>
    <td>teste</td>
  </tr>
</table>

<table id="Test2">
  <tr>
    <td onclick="test(this)">teste</td>
    <td>teste</td>
  </tr>
</table>

<script>
function test(obj) {

  while(obj.tagName.toUpperCase() !== "TABLE") {
    obj = obj.parentNode;
  }

    console.log(obj.id);

}

</script>

通过在td：Pure JavaScript中单击获取表ID

2 个答案: