Question

i am buliding an autocomplete for my website when i came across this style of building code:

$(function() {

    function log( message ) {
        $( "<div/>" ).text( message ).prependTo( "#log" );
        $( "#log" ).scrollTop( 0 );
    }

    $(element).autocomplete(....

    //more code
});

i know about closures, “IIFE”s but this one’s a new one for me.

• what’s with the “jQuery-wrapped” code above?
• is there any particular reason i should do that? (scope?)
• optimization-wise, should i even do it that way?

Answer 1

1. $(function() { }); is equivalent to $(document).ready(function() {}); and as before it executes once the DOM has been ready.

2. Defining a function inside is to tell that, the function is only available once the dom is ready to execute.

3. $(element).autocomplete(.... is simply implementing the plugin to the selector, once the DOM is ready to execute.

Hope its clear now 🙂

---

$(function() { or $(document).ready(function() { does not need the whole page to load, to run as $(window).load(fn) does.