跨页面点击按钮修改select下拉框选中值的问题求助

由于是跨页面（首页→联系页）操作，同页DOM操作方案不适用，以下是几种无需Bootstrap的原生实现方案：

方案1：URL参数传递 #

首页按钮代码 #

点击按钮时，通过URL参数携带目标选中值跳转至联系页：

<button onclick="window.location.href='contact.html?vol=' + encodeURIComponent('Le Vol découverte')">
  选择"Le Vol découverte"并跳转联系页
</button>

联系页处理代码 #

页面加载时读取URL参数，设置下拉框选中状态：

window.addEventListener('DOMContentLoaded', function() {
  const urlParams = new URLSearchParams(window.location.search);
  const targetVol = urlParams.get('vol');
  
  if (targetVol) {
    const selectElement = document.getElementById('select-vol');
    for (let option of selectElement.options) {
      if (option.value === decodeURIComponent(targetVol)) {
        option.selected = true;
        break;
      }
    }
  }
});

方案2：localStorage存储值 #

首页按钮代码 #

点击按钮时将目标值存入localStorage，再跳转联系页：

<button onclick="setVolAndRedirect()">
  选择"Le Vol découverte"并跳转联系页
</button>

<script>
function setVolAndRedirect() {
  localStorage.setItem('targetVol', 'Le Vol découverte');
  window.location.href='contact.html';
}
</script>

联系页处理代码 #

页面加载时读取localStorage的值，设置下拉框，完成后清除存储值避免影响后续访问：

window.addEventListener('DOMContentLoaded', function() {
  const targetVol = localStorage.getItem('targetVol');
  
  if (targetVol) {
    const selectElement = document.getElementById('select-vol');
    for (let option of selectElement.options) {
      if (option.value === targetVol) {
        option.selected = true;
        break;
      }
    }
    localStorage.removeItem('targetVol');
  }
});

方案3：sessionStorage存储值 #

逻辑与localStorage一致，区别是sessionStorage仅在当前浏览器会话有效，关闭页面后自动清除，无需手动移除：

首页按钮代码 #

<button onclick="setVolAndRedirect()">
  选择"Le Vol découverte"并跳转联系页
</button>

<script>
function setVolAndRedirect() {
  sessionStorage.setItem('targetVol', 'Le Vol découverte');
  window.location.href='contact.html';
}
</script>

联系页处理代码 #

window.addEventListener('DOMContentLoaded', function() {
  const targetVol = sessionStorage.getItem('targetVol');
  
  if (targetVol) {
    const selectElement = document.getElementById('select-vol');
    for (let option of selectElement.options) {
      if (option.value === targetVol) {
        option.selected = true;
        break;
      }
    }
  }
});

内容的提问来源于stack exchange，提问作者Krat'dev