在dropdown 1中选择时，隐藏dropdown 2中的某些选项，反之亦然

<!-- HTML -->
<select id="dropdown1" class="dropdown">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<select id="dropdown2" class="dropdown">
  <option value="option4">Option 4</option>
  <option value="option5">Option 5</option>
  <option value="option6">Option 6</option>
</select>

// JavaScript
const dropdown1 = document.getElementById('dropdown1');
const dropdown2 = document.getElementById('dropdown2');

dropdown1.addEventListener('change', function() {
  const selectedValue = dropdown1.value;
  
  if (selectedValue === 'option1') {
    // 隐藏dropdown 2中的某些选项
    dropdown2.options[0].style.display = 'none';
  } else if (selectedValue === 'option2') {
    // 隐藏dropdown 2中的其他选项
    dropdown2.options[1].style.display = 'none';
    dropdown2.options[2].style.display = 'none';
  } else {
    // 显示所有dropdown 2的选项
    for (let i = 0; i < dropdown2.options.length; i++) {
      dropdown2.options[i].style.display = 'block';
    }
  }
});

dropdown2.addEventListener('change', function() {
  const selectedValue = dropdown2.value;
  
  if (selectedValue === 'option4') {
    // 隐藏dropdown 1中的某些选项
    dropdown1.options[0].style.display = 'none';
  } else if (selectedValue === 'option5') {
    // 隐藏dropdown 1中的其他选项
    dropdown1.options[1].style.display = 'none';
    dropdown1.options[2].style.display = 'none';
  } else {
    // 显示所有dropdown 1的选项
    for (let i = 0; i < dropdown1.options.length; i++) {
      dropdown1.options[i].style.display = 'block';
    }
  }
});