Removendo opções de seleção no IE6

Question

Eu estou tentando repovoar um menu suspenso. Eu estou fazendo uma chamada de ajax para recuperar myList. Quando eu tenho a nova lista, eu remover todas as opções do elemento select e inserir os novos valores (cerca de 100 opções). Isso funciona muito bem em versões posteriores do IE e Firefox; a atualização é quase instantânea. No entanto, no IE6, essas operações realmente retardar o navegador para baixo. A caixa suspensa quase torna-se animado como opções são removidos a partir dele, e isso passa por alguns segundos. Existe alguma maneira de acelerar este fora-se de comparar a lista antiga para o novo e só remover / adicionar os itens que foram alterados?

$("#myselect").children.remove();

$.each(myList, function(i, val) {
   $("<option>").attr("value", val.myID)
                .text(val.myText)
                .appendTo("#myselect");
});

Answer 1

E se você criar um novo elemento e ligá-lo fora?

var newSelect = $("<select></select>");
$.each(myList, function(i, val) {
    $("<option>").attr("value", val.myID)
                 .text(val.myText)
                 .appendTo(newSelect);
});
$("#myselect").replaceWith(newSelect);

Answer 2

Apesar de seu código é muito mais agradável, se for muito lento, ir para a rota direta (eu fiz isso no passado, antes de usar jQuery, e foi instantânea em todos os navegadores, incluindo IE6). Basta remover todas as crianças a partir do seleto removendo o html:

$("#myselect").html('');

E modificar o circuito para que você criar o html para cada opção, e inseri-lo na escolha usando

$('#myselect').html(optionsHTML); 

Dependendo do desempenho, você pode tentar um meio termo entre esta solução e solução de karim79 (ie. Remover as opções com html (), e anexá-las usando a matriz em vez de criar HTML simples).