Shorthand for jQuery document ready event

Posted by | March 28, 2012 | JavaScript, Web Development | 5 Comments
jquery-logo

$(document).ready() is the must popular jQuery method.  Everything inside it will load as soon as the DOM is loaded and before the page contents are loaded. There also other shorter versions of this method which are not often used.

$(document).ready(function(){
    // the standard way
});

$().ready(function() {
    // little shorter version
});

jQuery(function($) {
    // more shorter version (shorthand)
});

$(function() {
   // the shorthand version
});

They all do exactly the same thing. I prefer to use the last method which is shorter and I can save a few characters by using this shorthand function. This pattern also prevent conflicts in your code. There other libraries which also using the name $ function name.

avatar

About Farid

Creative web developer/designer, big fan of HTML5, CSS3 and client-side development. Software developer at Allegra Strategies London.

  • Nino

    Nice collection saghbi, there is one more :)

    $(function() {
    // Stuff to do at DOM load.
    });

    The last one is not a short hand for DOM ready (correct me if i’m wrong). It’s just a self executing function. It will run as soon as the browser parses it.

  • http://www.faridesign.net/ Farid Hayati

    thanks, your right sagbhi. It’s a self-invoking anonymous function. Sagbhi I moet je spreken een keertje. lang niet gehoord van je. Ik ben begonnen ui element maken gebaseerd op html5, css3 and jquery. http://www.zozoui.com

  • Nino

    Sahbi is inderdaad lang geleden, ik moet jouw telefoonnr hebben, ik ben die kwijtgeraakt. Kun je mij die via facebook sturen jongen? Maar dat klinkt interessant man, elementen gebaseerd op html5 en css3. Soort van jQuery-UI maar dan componenten geanimeerd met css3?

  • Nino

    Heb je een github repo?

  • http://www.faridesign.net/ Farid Hayati

    Check je facebook