今天碰到个小活儿，就是要把页面上的那个下拉框给清空掉。有时候，比如重新加载点啥数据，或者用户点某个按钮，就需要先把原来下拉框里的选项都弄没，然后再加新的进去，或者就让它空着。
开始折腾
我就想着，这玩意儿不就是些选项嘛一个一个删掉呗？试试，好像也行，就是感觉有点笨。特别是选项多的时候，写个循环去一个个移除，代码看着就有点啰嗦，心里觉得肯定有更省事的法子。
你想，要是下拉框里有百八十个选项，那循环删起来，效率先不说，代码写着也不得劲儿。
找到窍门
后来捣鼓一下，也顺手查点东西，发现用不着那么麻烦。主要就两种思路：
- 一种是在服务器那边处理，如果你用的是像*之类的，它本身就带直接清空的方法，比如那个 ，后台代码里喊一声就行，挺方便。
- 另一种就是在浏览器这边，用JavaScript来搞定。这个更灵活，尤其是不想刷新整个页面的时候。
我这回，正好是在前端页面上操作，就选用JavaScript来弄。
实际操作
用JavaScript清空特别简单，我试下面这个法子，感觉挺好使：
第一步：找到那个下拉框。
每个下拉框在HTML里一般都有个身份证号，就是那个 id。比如我的下拉框 id 设置的是 "myDropdown"。*("myDropdown") 这句把它找出来，存到一个变量里，方便后面使。
像这样：
var dropdown = *("myDropdown");
第二步：直接清空。
找到这个下拉框对象之后，最直接的办法就是把它里面的内容（也就是那些选项 ）全给抹掉。有句代码特别好用：
* = '';
这句代码的意思就是，把下拉框内部的HTML内容设置成空字符串。里面的所有 标签自然就都没，下拉框一下子就变得空空如也。
还有个法子（稍微啰嗦点）：
之前想的那个循环删除，也可以优化一下。比如，可以一边检查下拉框里还有没有选项，一边删掉第一个选项，直到删完为止。
while (* > 0) { *(0); }
这个也行，但感觉还是上面那个 innerHTML = '' 来得更痛快。
检查结果
写完代码，刷新页面，或者触发那个需要清空下拉框的动作（比如点个按钮）。然后就去看那个下拉框，果然，里面的选项瞬间就没，干干净净。说明这方法是管用的。
小结一下
清空 dropdownlist 这事儿，不算复杂。关键是找到适合当前场景的方法。对我这回来说，用 JavaScript 直接设置 innerHTML = '' 是最快最省事的。几行代码就搞定，挺实践下来，还是这种简单直接的办法用着舒心。