Beranda
Javascript

Cara Menggunakan jQuery Library secara Async / Defer.

Cara Menggunakan jQuery Library secara Async / Defer.

Untuk menggunakan jQuery library secara async/defer, caranya dengan membuat tag external jquery library menggunakan javascript dengan memanfaatkan event onload untuk memastikan jquery library sudah dimuat.

Oke, Langsung saja gan! silahkan simpan kode berikut sebelum tag </body> atau pada file javascript web agan :

1. jQuery Library ( ASYNC )


if (typeof jQuery == 'undefined') {
    var jquery_library = document.createElement('script');
    jquery_library.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js';
    jquery_library.type = 'text/javascript';
    jquery_library.async = true;
    document.head.appendChild(jquery_library);
    jquery_library.onload = function() {
        jquery();
    };
} else {
    jquery();
}

2. jQuery Library ( DEFER )

if (typeof jQuery == 'undefined') {
    var jquery_library = document.createElement('script');
    jquery_library.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js';
    jquery_library.type = 'text/javascript';
    jquery_library.defer = true;
    document.head.appendChild(jquery_library);
    jquery_library.onload = function() {
        jquery();
    };
} else {
    jquery();
}
Untuk menggunkan kode jquery silahkan buat function jquery() { .. kode jquery .. } pada file javascript web agan, contoh :

3. Cara Memanggil fungsi jQuery


function jquery() {
  $(document).ready(function(){
      alert('Halo, juragan..');
  });
}
Semoga bermanfaat!

Posting Komentar