Question

I learned that using a reference variable is faster than using $() every line of code (see my previous question): jQuery – Is it okay to use $('#ElementId') everytime?. Now my question is how can I use this reference variable to maximize the power of jQuery? Please see the example below:

Without reference variable:

var ValueOfSelected = $('#SelectElementId option:selected').val();

With reference variable (pseudo-code):

var SelectElement = $('#SelectElementId');
var ValueOfSelected = $(SelectElement).SelectedOption.val();

Note that SelectedOption.val() is the pseudo-code here. Is there such function anyway?

Answer 1

You can use .find() to find the nested option.

var SelectElement = $('#SelectElementId');
var ValueOfSelected = SelectElement.find('option:selected').val();

…but because it is a select element, you can just use the val()^[docs] method directly.

var SelectElement = $('#SelectElementId');
var ValueOfSelected = SelectElement.val();

This will give you the value of the selected option.