最干净的方式是直接调用 DOM 元素的 remove() 方法，现代浏览器支持，IE 需用 parentNode.removeChild()；按文本删需用 textContent 并转数组避免漏删；批量删除应倒序或先筛选再删。
用 remove() 直接删指定
最干净的方式是直接调用 DOM 元素的 remove() 方法，不用操作父节点或索引。只要能拿到目标 元素，一行就能删掉：
document.querySelector('select[name="city"] option[value="shenzhen"]').remove();注意：remove() 是现代浏览器（Chrome 27+、Firefox 23+、Edge 12+、Safari 7.1+）原生支持的方法，IE 不支持。如果必须兼容 IE，得换方案。
IE 兼容：用 removeChild() 配合 parentNode
IE8–10 不支持 remove()，必须通过父元素删除子元素。关键点是别漏掉 parentNode：
-
selectElement.removeChild(optionElement)是标准写法 - 不能只写
optionElement.parentNode.removeChild(optionElement)—— 虽然也能跑，但多一次 DOM 查询，不必要 - 删之前建议先检查
optionElement是否存在，避免TypeError: Cannot read property 'removeChild' of null
const select = document.getElementById('mySelect');
const targetOption = select.querySelector('option[value="beijing"]');
if (targetOption) {
select.removeChild(targetOption);
}按文本内容删
有时后端传来的数据没给 value，只能靠显示文字匹配。注意用 textContent（不是 innerText），它更可靠、不触发重排：
立即学习“前端免费学习笔记（深入）”；
Array.from(select.options).forEach(opt => {
if (opt.textContent.trim() === '上海市') {
opt.remove();
}
});这里用了 Array.from() 把类数组 options 转成真数组，避免边遍历边修改导致漏删（原生 HTMLCollection 是实时更新的）。
批量删多个选项时别用 for...in 或正向 for
常见错误：循环 select.options 并用 i 下标删，结果删不全——因为每次删一个，后续选项下标全往前移了。
- 正确做法：倒序遍历（
for (let i = select.options.length - 1; i >= 0; i--)） - 或者用
while (select.options.length)全清空 - 或者用
Array.from(select.options).filter(...).forEach(...)先筛选再删
// 安全删所有 disabled 的 option Array.from(select.options) .filter(opt => opt.disabled) .forEach(opt => opt.remove());
删 看似简单，真正容易出问题的是 DOM 实时性、IE 兼容性、以及批量操作时的下标偏移。别依赖 selectedIndex 去定位要删的项，优先用 querySelector 或属性匹配直接抓到目标元素再删。
