Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Javascript / Tutorial

Memuat Jquery Dengan Metode Async Dan Defer

Cara Memuat jQuery.js dengan metode Async dan Defer

Tutorial kali ini ialah perihal bagaimana cara menulis jquery isyarat secara inline, tapi librari jquery nya dimuat secara Asynchronous dan Deferred (Asinkron dan Ditangguhkan).
Table of contents

Apa itu jQuery

jQuery ialah 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 ialah gratis, dan bersifat isyarat sumber terbuka dibawah lisensi MIT.

Kenapa memakai jQuery

  1. jQuery itu gratis
  2. jQuery itu simple, kita tidak perlu repot menuliskan isyarat yang sangat panjang, sebagaimana penggunaan javascript murni (menyesuaikan dengan keperluan isyarat dan efisiensi)
  3. jQuery sanggup dipelajari dengan cepat. Ribuan blog banyak yang mengulas perihal tutorial jQuery
  4. Kompatibel lintas browser. Kita tak perlu khawatir memakai jquery dalam kesesuaiannya dengan jenis browser bahkan dibrowser yang sangat bau tanah menyerupai 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 gres pada HTML5 tidak didukung, menyerupai <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 isyarat jQuery pada secara inline pada Halaman HTML

Untuk menuliskan isyarat jQuery pada halaman HTML, sanggup ditulis menyerupai rujukan 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.