如何隐藏表行中的值并在单击加号时显示它

<table>
  <tr class="row">
    <td>行1</td>
    <td>值1</td>
  </tr>
  <tr class="row">
    <td>行2</td>
    <td>值2</td>
  </tr>
  <tr class="row">
    <td>行3</td>
    <td>值3</td>
  </tr>
</table>

td.value {
  display: none;
}

<table>
  <tr class="row">
    <td class="toggle">+</td>
    <td class="value">值1</td>
  </tr>
  <tr class="row">
    <td class="toggle">+</td>
    <td class="value">值2</td>
  </tr>
  <tr class="row">
    <td class="toggle">+</td>
    <td class="value">值3</td>
  </tr>
</table>

// 获取所有的加号元素
var toggles = document.getElementsByClassName('toggle');

// 为每个加号元素添加点击事件监听器
for (var i = 0; i < toggles.length; i++) {
  toggles[i].addEventListener('click', function() {
    // 切换对应行的值的显示状态
    var value = this.parentNode.nextElementSibling;
    if (value.style.display === 'none') {
      value.style.display = 'table-cell';
    } else {
      value.style.display = 'none';
    }
  });
}