jQuery Object vs DOM Element
HTML
<select id="dropdown">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 34</option>
<option>Option 4</option>
<option>Option 5</option>
</select>
JavaScript
//jQuery Object vs DOM Element
var dropdownJquery = $('#dropdown'); //jQuery object
console.log('dropdown jQuery Object => ' + dropdownJquery);
console.log('dropdown.options not part of a jQuery Object => ' + dropdownJquery.options);
// http://api.jquery.com/get/
// https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement
var dropdownElement = dropdownJquery.get(0); //DOM element in jQuery object
console.log('dropdown DOM element => ' + dropdownElement);
console.log('dropdown DOM element has options => ' + dropdownElement.options);
//a function
function emptyList(box) {
if(box.options) {
console.log('emptyList(box) => Length of box.options => ' + box.options.length);
}
else {
console.log('box.options is undefined');
}
}
emptyList(dropdownJquery);
emptyList(dropdownElement);