DOMContentLoaded and load events

HTML

<script>
    // IE patch
    if (Function.prototype.bind && window.console && typeof console.log == "object") {
        ["log","info","warn","error","assert","dir","clear","profile","profileEnd"].forEach(function (method) {
            console[method] = this.bind(console[method], console);
        }, Function.prototype.call);
    }

    startTime = +new Date();
    require = {
        paths: {
            "domReady": "https://rawgithub.com/requirejs/domReady/2.0.1/domReady",
            "jquery": "http://code.jquery.com/jquery-1.10.2.min"
        },
        waitSeconds: 60
    };
    </script>
    <script src="http://requirejs.org/docs/release/2.1.8/minified/require.js"></script>
    <script>
    function log() {
        var args = Array.prototype.slice.apply(arguments);
        var evt = args[0];
        var type = evt && evt.type;
        args = [+new Date() - startTime + "ms", type].concat(args);
        console.log.apply(console, args);
    }
    
    require(["jquery"], function($) {
        $(log("jquery.ready"));
    });
    require(["domReady!"], log);
    window.addEventListener('load', log, false);
    window.addEventListener('DOMContentLoaded', log, false);
    </script>

    <img id="theImg" src="http://ie.microsoft.com/testdrive/HTML5/DOMContentLoaded/whidbey.jpg" width="300" height="300">

    <script>
    var theImg = document.getElementById("theImg");
    log("I am the trailing script and this is the image", theImg, theImg.id, theImg.parentNode, theImg.nextSibling);
    </script>