取消选中多个复选框后需要重新显示内容

<input type="checkbox" id="checkbox1" value="option1" onchange="handleChange()">
<label for="checkbox1">选项1</label>
<br>
<input type="checkbox" id="checkbox2" value="option2" onchange="handleChange()">
<label for="checkbox2">选项2</label>
<br>
<input type="checkbox" id="checkbox3" value="option3" onchange="handleChange()">
<label for="checkbox3">选项3</label>

<div id="content">
  初始内容
</div>

function handleChange() {
  // 获取所有取消选中的复选框
  var uncheckedCheckboxes = document.querySelectorAll('input[type="checkbox"]:not(:checked)');
  
  // 获取取消选中的复选框的值或标识符
  var uncheckedValues = Array.from(uncheckedCheckboxes).map(function(checkbox) {
    return checkbox.value;
  });
  
  // 根据值或标识符重新显示相应内容
  var contentElement = document.getElementById('content');
  if (uncheckedValues.includes('option1')) {
    contentElement.innerHTML = '选项1被取消选中';
  }
  if (uncheckedValues.includes('option2')) {
    contentElement.innerHTML = '选项2被取消选中';
  }
  if (uncheckedValues.includes('option3')) {
    contentElement.innerHTML = '选项3被取消选中';
  }
}