JavaScript中如何缩短if语句内的重复DOM操作代码？

当然可以，你提到的for循环思路完全可行，除此之外还有更简洁的批量处理方式，以下是几种优化方案：

方案1：使用数组存储目标ID + 循环遍历 #

把需要禁用的按钮ID存入数组，通过遍历数组统一设置禁用状态，代码更简洁且易于维护（后续要调整禁用的按钮只需修改数组即可）：

var operators = document.querySelectorAll(".operators button");
var string = screenInput.innerHTML;
var lastCharacter = string[string.length - 1];
console.log(lastCharacter);

if (lastCharacter === "+") {
  const disabledButtonIds = ["subtract-operator", "multiply-operator", "divide-operator"];
  disabledButtonIds.forEach(id => {
    document.getElementById(id).disabled = true;
  });
}

方案2：利用CSS选择器批量获取元素 #

如果你的按钮结构稳定，可以直接通过querySelectorAll选择除加号按钮外的所有操作符按钮，一次性设置禁用状态：

var operators = document.querySelectorAll(".operators button");
var string = screenInput.innerHTML;
var lastCharacter = string[string.length - 1];
console.log(lastCharacter);

if (lastCharacter === "+") {
  document.querySelectorAll(".operators button:not(#add-operator)").forEach(btn => {
    btn.disabled = true;
  });
}

额外提示 #

如果后续需要根据其他条件恢复按钮状态，可以先统一重置所有操作符按钮的禁用状态，再执行目标操作，避免状态混乱：

// 重置所有操作符按钮状态
operators.forEach(btn => btn.disabled = false);

if (lastCharacter === "+") {
  // 执行禁用逻辑
}

内容的提问来源于stack exchange，提问作者yeet