新增 option 到 select box 裡的2個方法

新增 option 到 select box 裡的2個方法,

方法1: 用 element (object) 方式.

function appendToSelect(select, value, content) {
    var opt;
    opt = document.createElement("option");
    opt.value = value;
    var theData = document.createTextNode(content);
    opt.appendChild(theData);
    select.appendChild(opt);
}

方法2: 用 string (html) 方式.

var select_option_html='';
if(final_array.length>0){
    for(var iFinal=0; iFinal<final_array.length; iFinal++){
        var array_selected_flag='';
        if(final_array[iFinal].indexOf('X')!=-1){
            array_selected_flag=' selected';
            final_array[iFinal] = final_array[iFinal].substring(0,final_array[iFinal].length-1);;
        }
        select_option_html+=['<option value="', final_array[iFinal].toString(), '"', array_selected_flag, '>', final_array[iFinal].toString(), '</option>'].join("");
    }
    $("#countries").html(select_option_html);
}

實際測試, 當資料量在 1萬筆左右, 用新版的 chrome(或 firefox) 來測其實差異不大, 理論上 string(html) 效能上比較快, 有人說方法1(element) 大約在 0.4秒, 方法2(string) 大約在 0.7秒, 其實差 0.3秒應該是無感, 理論上應該是 string(html) 比較優, 當在處理 "大量" 資料時.