Załaduj jQuery tylko wtedy, gdy nie jest obecny - CSS-Tricks

Spisie treści

Powiedzmy, że zamierzasz zrobić dołączenie na wielu stronach, a wewnątrz tego chcesz zrobić coś specyficznego dla jQuery. Ta strona może, ale nie musi, mieć już załadowany jQuery. Jeśli już tak jest, nie chcesz go ponownie ładować, ale jeśli nie, to robisz. To działa na to.

Inteligentny sposób asynchroniczny

// Only do anything if jQuery isn't defined if (typeof jQuery == 'undefined') ( if (typeof $ == 'function') ( // warning, global var thisPageUsingOtherJSLibrary = true; ) function getScript(url, success) ( var script = document.createElement('script'); script.src = url; var head = document.getElementsByTagName('head')(0), done = false; // Attach handlers for all browsers script.onload = script.onreadystatechange = function() ( if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) ( done = true; // callback function provided as param success(); script.onload = script.onreadystatechange = null; head.removeChild(script); ); ); head.appendChild(script); ); getScript('http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js', function() ( if (typeof jQuery=='undefined') ( // Super failsafe - still somehow failed… ) else ( // jQuery loaded! Make sure to use .noConflict just in case fancyCode(); if (thisPageUsingOtherJSLibrary) ( // Run your jQuery Code ) else ( // Use .noConflict(), then run your jQuery Code ) ) )); ) else ( // jQuery was already loaded // Run your jQuery Code );

Zwróć uwagę, że kod jQuery, który zamierzasz uruchomić, jest w wielu miejscach wywoływany. Nie powtarzaj się tam, umieść to w funkcji, którą możesz wywołać, aby rozpocząć.

Ten kod został dostosowany z tego miejsca.

Document.write way

Modne dzieci nie używają document.write, ale jeśli jesteś za stary, żeby się tym przejmować:

var jQueryScriptOutputted = false; function initJQuery() ( //if the jQuery object isn't available if (typeof(jQuery) == 'undefined') ( if (! jQueryScriptOutputted) ( //only output the script once… jQueryScriptOutputted = true; //output the script (load it from google api) document.write(""); ) setTimeout("initJQuery()", 50); ) else ( $(function() ( // do anything that needs to be done on document.ready // don't really need this dom ready thing if used in footer )); ) ) initJQuery();

Interesujące artykuły...