What is the distinction between head.ready() and head.load()?

4.2k Views Asked by Simon At 19 April 2025 at 14:48

Using the JS loader head.js I'm having a bit of a hard time distinguishing the subtle differences between head.ready() and head.load().

head.ready('jquery.js', function(){//Do something});

head.load('jquery.js', function(){//Do something});

As far as I understand both seem to load 'jquery.js' and then perform a callback when it is loaded. However, in practice I get some edge cases where head.load doesn't work as expected in Firefox making me think I am not understanding where to use head.load and where to use head.ready.

Original Q&A

There are 1 best solutions below

Sirikon On 05 December 2013 at 10:04 BEST ANSWER

Reading the API it seems like head.load loads the content, but head.ready is an Event Listener, you can also add a callback to head.load and would work too, but head.load is the only one who can actually load the resources, head.ready not.

EDIT: An example

<html>
    <head>
        <script src="head.min.js"></script>
        <script>
            // this loads jquery asyncrounously & in parallel
            head.load("jquery.min.js");
        </script>
    </head>
    <body>
        <!-- some content-->

        <!-- injected via a module or an include -->
        <script>
            // some function that depends on jquery
            head.ready("jquery.min.js", function () {
                // this will only be executed once jquery has finished loading
                $(".main").hide();
            });
        </script>

        <!-- some content-->
    </body>
</html>

What is the distinction between head.ready() and head.load()?

There are 1 best solutions below

Related Questions in JAVASCRIPT

Related Questions in JQUERY

Related Questions in HEAD.JS

Trending Questions

Popular # Hahtags

Popular Questions