When to use $ and when not to

Question

I have selected a control using the following variable

var txt = $("#text1");

Now when I have to handle events on the textbox, do I have to reference it as $(txt) or txt will do

$(txt).keydown(function() {})

or

txt.keydown(function(){})

What is the advantage. Please explain it taking the variable txt as the context.

Answer 1

If txt is already equal to a jquery object, there is no need to use $(txt) as it's just extra processing to return the same thing.

Answer 2

The best approach is to declare your variables so know what they are. Basically, what I'm saying is apply some apps hungarian and prefix your jQuery variables with a $

var $text1 = $("#text1");  // this is a jQuery object
var text1 = $text1[0];     // this is not

Answer 3

A bit more info on Chad's response.

The $() is a short cut to the commonly used function document.getElementById().

Once you lookup and store the object's value you don't need to look it up again. As Chad mentioned. Ask your self is the variable an object or a name (string), if it's a name you will have to lookup the object.

Answer 4

In my experience I've found that using $(txt) yields more predictable results compared to assigning it as a reference ans using the reference to call the same methods/properties. It's possibly superstition on my part, however a few of us at work have been foiled by using a reference such as txt rather than an implicit $(txt) once txt has been assigned.