tRikSonic
Tema

Memuat jQuery dengan metode Async dan Defer

Terakhir diperbarui : 23 Desember 2018 - 06.27

Cara Memuat jQuery.js dengan metode Async dan Defer

Tutorial kali ini adalah tentang bagaimana cara menulis jquery kode secara inline, tapi librari jquery nya dimuat secara Asynchronous dan Deferred (Asinkron dan Ditangguhkan).

Apa itu jQuery

jQuery adalah pustaka JavaScript lintas-platform yang didesain untuk menyederhanakan client-side scripting pada HTML. Dewasa ini, jQuery merupakan pustaka JavaScript yang paling populer, dengan 65% pemasangan dari 10 juta situs Web dengan pengunjung tertinggi. jQuery adalah gratis, dan bersifat kode sumber terbuka dibawah lisensi MIT.

Kenapa menggunakan jQuery

  1. jQuery itu gratis
  2. jQuery itu simple, kita tidak perlu repot menuliskan kode yang sangat panjang, sebagaimana penggunaan javascript murni (menyesuaikan dengan keperluan kode dan efisiensi)
  3. jQuery dapat dipelajari dengan cepat. Ribuan blog banyak yang mengulas tentang tutorial jQuery
  4. Kompatibel lintas browser. Kita tak perlu khawatir menggunakan jquery dalam kesesuaiannya dengan jenis browser bahkan dibrowser yang sangat tua seperti IE6. Disitus resmi jQuery ditulis :
    If you need to support older browsers like Internet Explorer 6-8, Opera 12.1x or Safari 5.1+, use jQuery 1.12.
    Catatan :
    Penggunaan jQuery di browser yang sangat tua, sangat tergantung cara penulisan kode, penggunaan selector, cara pemuatan jquery.js, serta dalam beberapa kasus HTML TAG yang baru pada HTML5 tidak didukung, seperti <main>, <section> dan lain lain.
  5. ...

Cara Penulisan Library jQuery dengan Async dan Defer

Cara menuliskan Library jQuery

Pertama Tulis Library jQuery didalam rentang element <head>...</head>
<html>
  <head>
    <title>...</title>
    <script async='async' defer='defer' src='/jquery.js'></script>
  </head>
  <body>
  
  </body>
</html>

Cara penulisan kode jQuery pada secara inline pada Halaman HTML

Untuk menuliskan kode jQuery pada halaman HTML, dapat ditulis seperti contoh berikut:
window.onload = function() {
    if (window.jQuery) {
       //Your jQuery code
    }
}

Contoh Lengkap

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>...</title>
<script async defer src='/jquery.min.js'></script>
</head>

<body>

<button>toggle #demo</button>
<p id='demo'>Hello world</p>

<script>
window.onload = function() {
  if (window.jQuery) {
     jQuery(document).ready(function($) {
        $( "button" ).click(function () {
           $( "#demo" ).toggle();
           $( this ).toggleClass( "active" )
        });
     });
  }
}
</script>

</body>
</html>
DEMO

Semoga bermanfaat.

2 komentar

Author apkmio
Author apkmio7/18/2019
Komentar ini telah dihapus oleh pengarang.
Author apkmio
Author apkmio7/18/2019ReplyBalas Komentar ini
mastul mas

btw test koment link yah Google
Comment Form

Posting Komentar

  1. Untuk menyisipkan sebuah link atau tautan gunakan <i rel="link=//example.com">teks disini</i>
    • Tanpa menggunakan https: dan http:
  2. Untuk menyisipkan sebuah kode yang pendek gunakan <i rel="code">kode disini</i>
  3. Untuk menyisipkan sebuah kode yang panjang gunakan <i rel="pre">kode disini</i>
  4. Untuk menyisipkan sebuah teks Tebal gunakan <strong>teks tebal disini</strong>
  5. Untuk menyisipkan sebuah teks Miring gunakan <em>teks miring disini</em>
  6. Untuk menyisipkan sebuah gambar gunakan <i rel="image">url gambar disini</i>

Ketentuan Komentar

  • Pengguna yang dapat berkomentar adalah pengguna yang memiliki akun google
  • Guna mengurangi komentar yang bersifat spam, maka akan diberlakukan langkah verifikasi kata.
  • Pengguna bertanggung jawab atas komentar yang dikirim
  • Admin dan penulis blog mempunyai hak untuk menampilkan, menghapus, menandai spam, pada komentar yang dikirim
  • Dengan mengirimkan sebuah komentar, maka pengguna dianggap menyetujui semua ketentuan diatas

Poin ketentuan diatas tidak bersifat tetap, dan dapat berubah kapan saja

Konversi Kode
Kode yang ingin dikonversi

Loading.....
X
Run
Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.