kiểm tra xem jquery đã được tải chưa, sau đó tải nó nếu sai

Có ai biết cách kiểm tra xem jquery đã được tải chưa (bằng javascript) rồi tải nếu nó chưa được tải.

cái gì đó như

if(!jQuery) {
    //load jquery file
}

Có thể như thế này:

<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>

Tránh sử dụng "if (! JQuery)" vì IE sẽ trả về lỗi: jQuery là 'không xác định'

Thay vào đó, hãy sử dụng: 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>

Bạn cũng sẽ cần kiểm tra xem JQuery đã tải hay chưa sau khi thêm nó vào tiêu đề. Nếu không, bạn sẽ phải đợi sự kiện window.onload, sự kiện này sẽ chậm hơn nếu trang có hình ảnh. Đây là một đoạn script mẫu để kiểm tra xem tệp JQuery đã được tải hay chưa, vì bạn sẽ không thể sử dụng $ (document) .ready (function ...

http://neighborhood.org/core/sample/jquery/append-to-head.htm

Phương pháp 1:

if (window.jQuery) {  
    // jQuery is loaded  
} else {
    // jQuery is not loaded
}

Phương pháp 2:

if (typeof jQuery == 'undefined') {  
    // jQuery is not loaded
} else {
    // jQuery is loaded
}

Nếu tệp jquery.js không được tải, chúng ta có thể buộc tải nó như sau:

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

Thử cái này :

<script>
  window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')
</script>

Thao tác này sẽ kiểm tra xem jQuery có sẵn hay không, nếu không, nó sẽ tự động thêm một jQuery từ đường dẫn được chỉ định.

Tham khảo: Mô phỏng một "include_once" cho jQuery

HOẶC LÀ

include_once tương đương cho js. Tham khảo: 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;
}

Mặc dù bạn có thể gắn thêm phần đầu, nó có thể không hoạt động trên tất cả các trình duyệt. Đây là phương pháp duy nhất tôi tìm thấy để hoạt động nhất quán.

<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>

Bạn có thể kiểm tra xem jQuery đã được tải hay chưa bằng nhiều cách như:

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
}

Bây giờ sau khi kiểm tra xem jQuery không được tải hay không, bạn có thể tải jQuery như sau:

Mặc dù phần này đã được nhiều người trả lời trong bài viết này nhưng vẫn trả lời vì lợi ích của mã

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

Bài cũ nhưng tôi đã thực hiện một giải pháp tốt những gì được thử nghiệm trên những nơi serval.

https://github.com/CreativForm/Load-jQuery-if-it-is-not-already-loaded

MÃ:

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

Tại GitHub thì giải thích tốt hơn nhưng nhìn chung thì chức năng này bạn có thể thêm vào bất kỳ đâu trong mã HTML của mình và bạn sẽ khởi tạo jquery nếu chưa được tải.

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

<script>
if (typeof(jQuery) == 'undefined'){
        document.write('<scr' + 'ipt type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></scr' + 'ipt>');
}
</script>

Tôi đang sử dụng CDN cho dự án của mình và như một phần của việc xử lý dự phòng, tôi đã sử dụng mã bên dưới,

<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>

Chỉ để xác minh, tôi đã xóa tham chiếu CDN và thực thi mã. Nó bị hỏng và nó không bao giờ được nhập vào vòng lặp if as typeof jQuery đang đến dưới dạng hàm thay vì không xác định.

Điều này là do phiên bản cũ hơn của jquery 1.6.1 được lưu trong bộ nhớ cache, hàm trả về và làm hỏng mã của tôi vì tôi đang sử dụng jquery 1.9.1. Vì tôi cần phiên bản jquery chính xác, tôi đã sửa đổi mã như bên dưới,

<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>