Завантажувати jQuery, лише якщо його немає - CSS-хитрощі

Anonim

Скажімо, ви збиралися зробити включення на цілу купу сторінок, а всередині цього включення ви хотіли зробити деякі специфічні матеріали для jQuery. На цій сторінці jQuery може бути завантажено або не завантажено. Якщо це вже відбувається, ви не хочете завантажувати його знову, але якщо ні, то робите. Це працює для цього.

Розумний асинхронний шлях

// 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 );

Зверніть увагу, як у кількох місцях викликається код jQuery, який ви збираєтесь запустити. Не повторюйся там, поклади це в функцію, яку ти можеш викликати, щоб почати справу.

Цей код було адаптовано звідси.

Document.write способом

Хіп-діти не використовують document.write, але якщо ви занадто старі, щоб піклуватися:

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