如何使子行和子列可点击？

<table>
  <tr>
    <th></th>
    <th>子列1</th>
    <th>子列2</th>
    <th>子列3</th>
  </tr>
  <tr class="子行">
    <td>子行1</td>
    <td>内容1</td>
    <td>内容2</td>
    <td>内容3</td>
  </tr>
  <tr class="子行">
    <td>子行2</td>
    <td>内容4</td>
    <td>内容5</td>
    <td>内容6</td>
  </tr>
  <tr class="子行">
    <td>子行3</td>
    <td>内容7</td>
    <td>内容8</td>
    <td>内容9</td>
  </tr>
</table>

// 获取所有子行和子列的元素
var 子行元素 = document.getElementsByClassName("子行");
var 子列元素 = document.getElementsByTagName("td");

// 为每个子行和子列添加点击事件监听器
for (var i = 0; i < 子行元素.length; i++) {
  子行元素[i].addEventListener("click", 点击子行);
}

for (var j = 0; j < 子列元素.length; j++) {
  子列元素[j].addEventListener("click", 点击子列);
}

// 子行点击事件处理程序
function 点击子行() {
  // 在这里执行子行被点击后的操作
  console.log("子行被点击");
}

// 子列点击事件处理程序
function 点击子列() {
  // 在这里执行子列被点击后的操作
  console.log("子列被点击");
}