The value of a $

Testing speeds between two different techniques that populate a select (DDL).

by Matthew Bramer

HTML

<div id='Append'>
    <select size='1'></select>
</div>
<div id='Array'>
    <select size='1'></select>
</div>

JavaScript

var optVals = 100;
var optName = "Option ";

var d = new Date();

//Build select using jQuery to append every option
for(i=0; i<optVals; i++) {
    $("#Append select").append("<option value='" + i + "'>" + optName + i + "</option>");
}

var dEnd = new Date();
//determine amount of time taken for append
$("#Append").append((dEnd.getTime() - d.getTime()) + " milliseconds");

//Array variable for ddl
var optOutput = [];
var d1 = new Date();

//Build select using an array for every option
for(i=0; i<optVals; i++) {
    optOutput.push("<option value='" + i + "'>" + optName + i + "</option>");
}

$("#Array select").append( optOutput.join('') );

var d1End = new Date();
//determine amount of time taken for array
$("#Array").append((d1End.getTime() - d1.getTime()) + " milliseconds");