Simple JS/jQuery question

JavaScript
1

I am trying to choose a <select> element in a form with an ID of mySelect.

Given:

var myVar = 
{
	init: function() 
	{
		var selectOption = document.getElementById('mySelect');
		alert(selectOption);
	}
}
myVar.init();

and:

var myVar = 
{
	init: function() 
	{
		var selectOption = $('#mySelect');
		alert(selectOption);
	}
}
myVar.init();

How come the JavaScript version’s alert returns:
[object HTMLSelectElement]

…but the jQuery version returns?
[object Object]

Thanks :slight_smile:

2

Javascript returns the DOM Element itself, while jQuery returns a jQuery object. The DOM Element is actually in the jQuery object and can be obtained by $(‘#mySelect’).get(0); might you so wish.

The reason for jQuery returning a jQuery object is that you can call functions on it like .show(), .hide(), etc. which are not natively available on the DOM Elements.

3

Ah ok, that explains it. Cheers! :smiley: