Best Practice to refer a asp.net control in jQuery

Question

I see 4 or more ways of referring to an asp.net control in jQuery

$("input[id$='txt1']"); OR $("#<%= txt1.ClientID %>"); OR $("#txt1"); OR or access using class

Can you guide which one to choose in what scenario

Answer 1

I've been using the endsWith selector that you have included in your question. All other options require additional leg-work on the server-side.

Answer 2

I don't like seeing inline code so I would never use $("#<%= txt1.ClientID %>");

I would probably use $("input[id$='txt1']"); since I wouldn't have duplicated names in my code and matching on the part that isn't .NET's addition will be quite reliable.

Answer 3

Here's a great discussion about this topic, specifically about speeding up the performance of the endsWith selector (look in the comments too for some alternate solutions as well).