Кто-нибудь знает, как проверить, загружен ли jquery (с помощью javascript), а затем загрузить его, если он не был загружен.
что-то вроде
if(!jQuery) {
//load jquery file
}
Кто-нибудь знает, как проверить, загружен ли jquery (с помощью javascript), а затем загрузить его, если он не был загружен.
что-то вроде
if(!jQuery) {
//load jquery file
}
Ответы:
Может быть, примерно так:
<script>
if(!window.jQuery)
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "path/to/jQuery";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
headкоторому он может добавить элемент сценария
( document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0] ).appendChild( script );
Избегайте использования «if (! JQuery)», поскольку IE вернет ошибку: jQuery is 'undefined'
Вместо этого используйте: if (typeof jQuery == 'undefined')
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
Вам также нужно будет проверить, загрузился ли JQuery после добавления его в заголовок. В противном случае вам придется дождаться события window.onload, которое будет медленнее, если на странице есть изображения. Вот пример сценария, который проверяет, загружен ли файл JQuery, так как у вас не будет возможности использовать $ (document) .ready (function ...
http://neighborhood.org/core/sample/jquery/append-to-head.htm
script.onload = function() { alert('jQuery loaded!'); }? Это сработает?
Способ 1:
if (window.jQuery) {
// jQuery is loaded
} else {
// jQuery is not loaded
}
Способ 2:
if (typeof jQuery == 'undefined') {
// jQuery is not loaded
} else {
// jQuery is loaded
}
Если файл jquery.js не загружен, мы можем принудительно загрузить его так:
if (!window.jQuery) {
var jq = document.createElement('script'); jq.type = 'text/javascript';
// Path to jquery.js file, eg. Google hosted version
jq.src = '/path-to-your/jquery.min.js';
document.getElementsByTagName('head')[0].appendChild(jq);
}
Попробуй это :
<script>
window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')
</script>
Это проверяет, доступен ли jQuery или нет, если нет, он будет динамически добавлять его по указанному пути.
Ссылка: имитация include_once для jQuery
ИЛИ
Эквивалент include_once для js. Ссылка: https://raw.github.com/kvz/phpjs/master/functions/language/include_once.js
function include_once (filename) {
// http://kevin.vanzonneveld.net
// + original by: Legaev Andrey
// + improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// + improved by: Michael White (http://getsprink.com)
// + input by: Brett Zamir (http://brett-zamir.me)
// + bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// + bugfixed by: Brett Zamir (http://brett-zamir.me)
// - depends on: include
// % note 1: Uses global: php_js to keep track of included files (though private static variable in namespaced version)
// * example 1: include_once('http://www.phpjs.org/js/phpjs/_supporters/pj_test_supportfile_2.js');
// * returns 1: true
var cur_file = {};
cur_file[this.window.location.href] = 1;
// BEGIN STATIC
try { // We can't try to access on window, since it might not exist in some environments, and if we use "this.window"
// we risk adding another copy if different window objects are associated with the namespaced object
php_js_shared; // Will be private static variable in namespaced version or global in non-namespaced
// version since we wish to share this across all instances
} catch (e) {
php_js_shared = {};
}
// END STATIC
if (!php_js_shared.includes) {
php_js_shared.includes = cur_file;
}
if (!php_js_shared.includes[filename]) {
if (this.include(filename)) {
return true;
}
} else {
return true;
}
return false;
}
Даже если у вас может быть голова, она может работать не во всех браузерах. Это был единственный метод, который работал стабильно.
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
document.write('<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"><\/script>');
}
</script>
document.write ОЧЕНЬ неодобрительно?
Вы можете проверить, загружен ли jQuery, разными способами, например:
if (typeof jQuery == 'undefined') {
// jQuery IS NOT loaded, do stuff here.
}
if (typeof jQuery == 'function')
//or
if (typeof $== 'function')
if (jQuery) {
// This will throw an error in STRICT MODE if jQuery is not loaded, so don't use if using strict mode
alert("jquery is loaded");
} else {
alert("Not loaded");
}
if( 'jQuery' in window ) {
// Do Stuff
}
Теперь, проверив, не загружен ли jQuery, вы можете загрузить jQuery следующим образом:
Хотя на эту часть многие ответили в этом посте, но все же отвечаем ради полноты кода
// This part should be inside your IF condition when you do not find jQuery loaded
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://code.jquery.com/jquery-3.3.1.min.js";
document.getElementsByTagName('head')[0].appendChild(script);
Старый пост, но я сделал хорошее решение, которое проверено на сервальных местах.
https://github.com/CreativForm/Load-jQuery-if-it-is-not-already-loaded
КОД:
(function(url, position, callback){
// default values
url = url || 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js';
position = position || 0;
// Check is jQuery exists
if (!window.jQuery) {
// Initialize <head>
var head = document.getElementsByTagName('head')[0];
// Create <script> element
var script = document.createElement("script");
// Append URL
script.src = url;
// Append type
script.type = 'text/javascript';
// Append script to <head>
head.appendChild(script);
// Move script on proper position
head.insertBefore(script,head.childNodes[position]);
script.onload = function(){
if(typeof callback == 'function') {
callback(jQuery);
}
};
} else {
if(typeof callback == 'function') {
callback(jQuery);
}
}
}('https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js', 5, function($){
console.log($);
}));
На GitHub это лучшее объяснение, но обычно эту функцию вы можете добавить в любом месте вашего HTML-кода, и вы инициализируете jquery, если он еще не загружен.
var f = ()=>{
if (!window.jQuery) {
var e = document.createElement('script');
e.src = "https://code.jquery.com/jquery-3.2.1.min.js";
e.onload = function () {
jQuery.noConflict();
console.log('jQuery ' + jQuery.fn.jquery + ' injected.');
};
document.head.appendChild(e);
} else {
console.log('jQuery ' + jQuery.fn.jquery + '');
}
};
f();
Я использую CDN для своего проекта, и как часть обработки отката я использовал код ниже,
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
if ((typeof jQuery == 'undefined')) {
document.write(unescape("%3Cscript src='/Responsive/Scripts/jquery-1.9.1.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
Чтобы проверить, я удалил ссылку на CDN и выполнил код. Он сломан, и он никогда не входил в цикл if, поскольку typeof jQuery поступает как функция вместо undefined.
Это из-за кешированной старой версии jquery 1.6.1, которая возвращает функцию и нарушает мой код, потому что я использую jquery 1.9.1. Поскольку мне нужна точная версия jquery, я изменил код, как показано ниже,
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
if ((typeof jQuery == 'undefined') || (jQuery.fn.jquery != "1.9.1")) {
document.write(unescape("%3Cscript src='/Responsive/Scripts/jquery-1.9.1.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>