Bookmarklet wait until Javascript is loaded Bookmarklet wait until Javascript is loaded javascript javascript

Bookmarklet wait until Javascript is loaded


It depends on how you are actually loading jQuery. If you are appending a script element to the page, you can use the same technique that jQuery uses to dynamically load a script.

EDIT: I did my homework and actually extracted a loadScript function from the jQuery code to use in your bookmarklet. It might actually be useful to many (including me).

function loadScript(url, callback){    var head = document.getElementsByTagName("head")[0];    var script = document.createElement("script");    script.src = url;    // Attach handlers for all browsers    var done = false;    script.onload = script.onreadystatechange = function()    {        if( !done && ( !this.readyState                     || this.readyState == "loaded"                     || this.readyState == "complete") )        {            done = true;            // Continue your code            callback();            // Handle memory leak in IE            script.onload = script.onreadystatechange = null;            head.removeChild( script );        }    };    head.appendChild(script);}// Usage: // This code loads jQuery and executes some code when jQuery is loadedloadScript("https://code.jquery.com/jquery-latest.js", function(){    $('my_element').hide();});


To answer your first question: Javascript is interpreted sequentially, so any following bookmarklet code will not execute until the library is loaded (assuming the library was interpreted successfully - no syntax errors).

To prevent the files from being cached, you can append a meaningless query string...

url = 'jquery.js?x=' + new Date().getTime();


I've paid an attention that in Chrome the order of scripts that are loaded is undetermined, when using @Vincent Robert's technique. In this case a little modification helps:

(function() {    var callback = function() {        // Do you work    };        // check for our library existence    if (typeof (MyLib) == 'undefined') {        var sources = [                'http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js',            'https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js',            'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js',            'http://myhost.com/javascripts/mylib.min.js'];        var loadNextScript = function() {            if (sources.length > 0) {                var script = document.createElement('script');                script.src = sources.shift();                document.body.appendChild(script);                var done = false;                script.onload = script.onreadystatechange = function() {                    if (!done                            && (!this.readyState || this.readyState == "loaded" || this.readyState == "complete")) {                        done = true;                        // Handle memory leak in IE                        script.onload = script.onreadystatechange = null;                        loadNextScript();                    }                }            } else {                callback();            }        }        loadNextScript();    } else {        callback();    }})();