我如何在不使用JQuery库和JavaScript的情况下重写它？

我在JQuery中有几行代码：

     var central = $('#townid option:contains("Central")');
     if (central.length){
        central.insertAfter('select option:first-child');
     }

---

如何在不使用JQuery库和JavaScript的情况下重写它？

正确的翻译如下：

var selects = document.getElementsByTagName('select'),
    options = document.getElementById('townid').getElementsByTagName('option'),
    options = Array.prototype.slice.call(options), //2 lines only for readability
    tmp = document.createDocumentFragment();

for(var i = 0, l = options.length; i < l; i++) {
    var option = options[i],
        text = option.innerText || option.textContent;
    if(text.indexOf('Central') > -1) {
        tmp.appendChild(option);
    }
}

for(var i = 0, l = selects.length; i < l; i++) {
    var select = selects[i],
         opts = select.getElementsByTagName('option');
    if(opts.length > 1) {
        select.insertBefore(tmp.cloneNode(true), opts[1]);
    }
    else {
        select.appendChild(tmp.cloneNode(true));
    }
}

更新：

如果选项的文本应恰好位于

中心位置

，请正常比较文本：

if(text === 'Central')

---

当你尝试这样做的时候，你真的很感激jQuery…+1教我一些新东西：@mplungjan:：）这是必要的，因为将

选项添加到
DocumentFragment
中也会将其从
节点列表中删除（因为它是活动的）我以为这是因为你不能切片dom节点列表，因为它不是数组…@Felix这种语法对我来说也是新的：
var option=options[I]，text=option.innerText | | option.textContent
还是打字错误？@mplungjan:我只使用
切片
将节点列表转换为数组。无论我在DOM中的何处添加选项，数组的内容都不会更改，但节点列表会更改。如果我在节点列表上迭代，那么在将其中一个选项移动到DocumentFragment之后，节点列表少了一个元素，因此迭代就搞砸了。这就像在数组上循环时从数组中删除元素一样。
if(text === 'Central')