JavaScript中能否使用三元运算符简化如下多分支if else条件语句？

完全可以简化，你的场景属于典型的值对应特定操作的分支逻辑，用映射表替代冗余的if判断即可，重复的display赋值逻辑也可以统一抽离：

优化后代码 #

function pathology() {
  // 建立下拉值和对应展示元素ID的映射关系
  const showMap = {
    'Cushings': 'cushingsDetails',
    'Acromegaly': 'acromegalyDetails',
    'Other': 'otherPathologySuspectingDetails'
  }
  const pathologyValue = document.getElementById('pathologySuspecting').value
  // 先统一隐藏所有关联元素
  Object.values(showMap).forEach(id => {
    document.getElementById(id).style.display = 'none'
  })
  // 匹配到对应值时仅显示目标元素
  if (showMap[pathologyValue]) {
    document.getElementById(showMap[pathologyValue]).style.display = 'block'
  }
}

优化说明 #

• 完全对齐原有逻辑：匹配不到有效值时所有元素保持隐藏，和原代码else分支效果一致
• 消除了所有重复的display赋值代码，后续新增选项只需要在showMap里加一行键值对即可，维护成本大幅降低
• 逻辑分层清晰，比多层嵌套的if-else可读性高很多

可选进阶优化 #

如果这个函数会被频繁触发，可以提前缓存DOM元素，避免每次执行都重复查询DOM，性能更好：

// 提前缓存DOM元素，页面加载后仅查询一次
const pathoElements = {
  Cushings: document.getElementById('cushingsDetails'),
  Acromegaly: document.getElementById('acromegalyDetails'),
  Other: document.getElementById('otherPathologySuspectingDetails')
}
const pathoSelect = document.getElementById('pathologySuspecting')

function pathology() {
  const currentValue = pathoSelect.value
  Object.values(pathoElements).forEach(el => el.style.display = 'none')
  pathoElements[currentValue] && (pathoElements[currentValue].style.display = 'block')
}

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