如何仅显示选定复选框的数据

<ul>
  <li>
    <input type="checkbox" id="checkbox1">
    <span>Data 1</span>
  </li>
  <li>
    <input type="checkbox" id="checkbox2">
    <span>Data 2</span>
  </li>
  <li>
    <input type="checkbox" id="checkbox3">
    <span>Data 3</span>
  </li>
</ul>

// 获取复选框元素
const checkboxes = document.querySelectorAll('input[type="checkbox"]');

// 监听复选框状态变化
checkboxes.forEach(function(checkbox) {
  checkbox.addEventListener('change', function() {
    // 遍历所有复选框
    checkboxes.forEach(function(cb) {
      // 检查复选框状态
      if (cb.checked) {
        // 显示相关数据项
        cb.nextElementSibling.style.display = 'block';
      } else {
        // 隐藏相关数据项
        cb.nextElementSibling.style.display = 'none';
      }
    });
  });
});