Coding Standards - jQuery Best Practices

These articles will give you details on best practices for writing jQuery code. JQuery

1. Always use the latest version of the library from

2. Know your selectors

All selectors are not equally efficient
a. ID selectors
b. Element selectors (form, input, etc.)
c. Class selectors
d. Pseudo and Attribute selectors (:visible, :hidden, [attribute=value], etc.)

3. DOM Insertion

Every DOM insertion is costly
You can minimize it by building HTML strings and using single append as late as possible
Use detach() if doing heavy interaction with a node then re-insert it when done

4. Caching

One of the most used features of jQuery is its ability to retrieve a DOM element by simply passing a reference to the $() function, be it an ID or class or whatever.
Every time we use $() function jQuery searches for the DOM element, and if the element is found it creates an object representing a clone of that element, with added capabilities.
This is true even for elements we already found using this function, so calling this function for the same elements more than once is redundant.




var foo = $("#foo");
  foo.css('color', 'red');;

5. Chaining: Less code, easier to write and it runs faster


  var foo = $("#foo");

6. Use ID selector whenever possible

7. Don't mix CSS with jQuery

8. Avoid multiple $(document).ready() calls

9. Do not refer jQuery file directly from internet. Better to download a file in local and provide path of local jQuery file



We use cookies and other technologies to improve your experience on our website and to analyze our traffic. By browsing our website, you consent to our use of cookies and other tracking technologies.

Accept cookies and close this message
Win now