javascript - property - title label html

Bookmarklet espera hasta que se cargue Javascript

Question

Tengo un bookmarklet que carga jQuery y algunas otras bibliotecas js.

Cómo puedo:

• Espere hasta que la biblioteca de javascript que estoy usando esté disponible / cargada. Si trato de usar el script antes de que termine de cargarse, como usar la función $ con jQuery antes de que se cargue, se lanza una excepción indefinida.
• Asegúrese de que el bookmarklet que cargue no se almacene en la caché (sin usar un encabezado de servidor, o obviamente, es que se trata de un archivo javascript: un metatag )

¿Alguien sabe si onload para javascript agregado dinámicamente funciona en IE? (Para contradecir este post )

¿Cuál es la solución más simple, la resolución más limpia a estos problemas?

Answer 1

Depende de cómo estés cargando jQuery. Si está agregando un elemento de script a la página, puede usar la misma técnica que jQuery utiliza para cargar dinámicamente un script.

EDITAR : Hice mi tarea y en realidad extraje una función loadScript del código jQuery para usar en su bookmarklet. En realidad podría ser útil para muchos (incluyéndome a mí).

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 loaded
loadScript("https://code.jquery.com/jquery-latest.js", function()
{
    $(''my_element'').hide();
});

Answer 2

He prestado atención a que en Chrome el orden de los scripts que se cargan es indeterminado, cuando se usa la técnica de @Vincent Robert. En este caso una pequeña modificación ayuda a:

(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();
    }
})();

Answer 3

Me acerqué un poco más a this , pero no del todo. Sería bueno tener un ejemplo discreto de un marcador que demostrara cómo evitar el almacenamiento en caché.

Answer 4

Para responder a su primera pregunta: Javascript se interpreta secuencialmente, por lo que cualquier siguiente código de bookmarklet no se ejecutará hasta que se cargue la biblioteca (suponiendo que la biblioteca se interpretó correctamente, sin errores de sintaxis).

Para evitar que los archivos se almacenen en caché, puede agregar una cadena de consulta sin sentido ...

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