有没有一种方法可以在父容器上对事件侦听器进行编码,以捕获其所有输入元素上的焦点/模糊事件?

document.querySelector('table.two').addEventListener('change', () => {
  console.log('change event');
}, false);

document.querySelector('table.two').addEventListener('focus', () => {
  console.log('focus event');
}, false);

table {
  border-spacing: 0;
  border-collapse: separate;
  margin: 0 auto;
}

td {
  border: 1px solid rgb(150, 150, 150);
  border-top-color: transparent;
  padding: 0 20px;
  background-color: white;
}

tr:first-child td {
  border-top-color: rgb(150, 150, 150);
}

td>div {
  width: 300px;
  height: 50px;
  margin: 10px auto;
  border: 1px solid rgb(150, 150, 150);
  background-color: white;
}

tr.sel {
  position: relative;
  box-shadow: 4px 4px 3px rgb(50, 50, 50);
}

td>div.sel {
  position: relative;
  z-index: 20;
  border-color: blue;
}

input {
  width: 280px;
  border: 1px solid green;
}

<table class="two">
  <tbody>
    <tr class="sel">
      <td>
        <div></div>
        <div class="sel"><input type='text'></div>
        <div></div>
      </td>
    </tr>

    <tr>
      <td>
        <div></div>
        <div><input type='text'></div>
        <div></div>
      </td>
    </tr>
  </tbody>
</table>