cara menggunakan jQuery



Kali ini saya akan membahas mengenai jQuery kali ini saya akan bahas cara menggunakan jQuery. Mudah loh menggunakan jQuery ini, kita bisa membuat animasi dengan hanya beberapa baris kode saja .

Baca juga apa itu jQuery

Baik langsung saja pertama tama kita sisipkan file jquery kita ke html yang kita punya

<script type="text/javascript"src="http://code.jquery.com/jquery-3.1.1.js"></script>

Sekarang kita memiliki sisipan file jquery. Setelah itu kita bisa membuat apa yang kita inginkan . Penulisan untuk menggunakan jQuery adalah

$(selectornya).action()

Jadi selectonya apa gitu ? tag div dan action, aksinya apa ? bisa itu clik, load, dkk. Baik kita coba gunkanan

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Belajar jquery</title>
      <script type="text/javascript"src="http://code.jquery.com/jquery-3.1.1.js"></script>
      <script type="text/javascript">
      $( document ).ready(function() {
        $( "#hilang" ).click(function() {
          $("h1").hide(1000);
        });
        $( "#ada" ).click(function() {
          $("h1").show(1000);
        });
      });
      </script>
  </head>
  <body>
    <h1>Bermain jQuery</h1>
    <div id="hilang">
      Hilangkan h1
    </div>
    <div id="ada">
      Tampilkan h1
    </div>
  </body>
</html>

Baik kita coba lihat hasilnya, ketika menkli hilangkan h1 maka h1 akan hilang dan ketika kita mengklik tampilkan h1 maka akan menampilkan h1 . Baik sekarang saya akan jelaskan

Untuk pertama tama kita mengsisipkan dulu jquerynya, seperti tadi saya bilang

<script type="text/javascript"src="http://code.jquery.com/jquery-3.1.1.js"></script>

Setelah itu kita bebas membuat apa saja dengan jquery ini. Baik pertama tama kita harus ada

$( document ).ready(function() {});

Setelah itu kita membuat aksi untuk div yang id hilang dan ada

        $( "#hilang" ).click(function() {
          $("h1").hide(1000);
        });
        $( "#ada" ).click(function() {
          $("h1").show(1000);
        });

Artinya ketika kita mengklik yang memiliki id hilang maka akan melakukan $("h1").hide(1000); mencari tag h1 dan melakukan fungsi hide, untuk parameter 1000 untuk adalah durasi hilangnya. Saya buat durasi hilangnya 1000 ms atau 1 detik . Begitu juga sama hanya dengan yang memiliki id ada .


Jadi itu dia cara untuk menggunakan jQuery, jadi pertama tama kita mengsisipkan file jQuerynya dulu lalu kita bisa melakukan fungsi fungsi yang telah di sediakan oleh jQuery . jQuery untuk awalan perintannya menggunakan $ (simbol dolar) ,

Baik itu dia bahas bahas mengenai jQuery. Semoga bermanfaat dan sampai jumpa .


Belum ada Komentar untuk "cara menggunakan jQuery"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel