js控制select选中状态

// 假设HTML中有如下结构:
// <select id="mySelect">
//   <option value="1">Option 1</option>
//   <option value="2">Option 2</option>
//   <option value="3">Option 3</option>
// </select>

// 通过value设置选中项
document.getElementById('mySelect').value = '2'; // 选中"Option 2"

// 或者通过option的索引设置（索引从0开始）
document.getElementById('mySelect').selectedIndex = 1; // 同样选中"Option 2"

// 获取选中的option元素的value
var selectedValue = document.getElementById('mySelect').value;
console.log(selectedValue); // 输出当前选中的value

// 获取选中的option元素对象
var selectedOption = document.querySelector('#mySelect option:checked');
console.log(selectedOption.text); // 输出当前选中的文本内容

// 添加新选项
var newOption = document.createElement('option');
newOption.value = '4';
newOption.text = 'Option 4';
document.getElementById('mySelect').appendChild(newOption);

// 删除选项
var optionToRemove = document.querySelector('#mySelect option[value="3"]');
if (optionToRemove) {
  optionToRemove.remove();
}

window.onload = function() {
  document.getElementById('mySelect').value = '2';
};

var newOption = document.createElement('option');
newOption.value = '4';
newOption.text = 'Option 4';
document.getElementById('mySelect').appendChild(newOption);
document.getElementById('mySelect').value = '4'; // 确保新选项被选中