Scribd Logo
Unggah

Selamat datang di Scribd!

  • BAB V Javascript Dan JQuery

    Diunggah oleh

    dwita dinda
    3 tayangan6 halaman
    Javascript dan Jquery digunakan untuk tampilan web yang lebih interaktif.

    Judul Asli

    BAB V Javascript dan JQuery

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    DOC, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    Javascript dan Jquery digunakan untuk tampilan web yang lebih interaktif.

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai DOC, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    3 tayangan6 halaman

    BAB V Javascript Dan JQuery

    Diunggah oleh

    dwita dinda
    Javascript dan Jquery digunakan untuk tampilan web yang lebih interaktif.

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai DOC, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 6

    BAB V

    Javascript

    5.1 Tujuan :
    1. Pengertian dan cara memakai Javascript
    2. Pengertian Java script sebagai bahasa berorientasi Objek
    3. Penanganan evenhandler website dengan Javascript
    4. Pemahaman cara Pemasukan data dengan javascript
    5. Pemahaman cara looping di javascript

    5.2 Pendahuluan
    5.2.1 Pengenalan Javascript
    Javascript di perkenalkan pertamakali olehNetscape padatahun1995.pada awalnya bahasa
    ini dinamakan“LiveScript”yang berfungsi sebagai bahasa sederhana untuk browser
    Netscape Navigator 2. Pada masa itu bahasa ini banyak dikritik karena kurangan,
    pengembangannya yang terkesanburu –buru dan tidak ada pesan kesalahanyang
    ditampilkan setiap kali kita membuat kesalahan pada saat menyusun suatu program.
    Kemudian sejalan dengan sedang giatnya kerjasama antara Netscape dan Sun
    (pengembangbahasapemrograman“Java”) padamasa itu, makaNetscape memberikan
    nama“JavaScript” kepada bahasa tersebut pada tanggal 4 Desember 1995.
    Javascript adalah bahasa yang berbentuk kumpulanskrip yang pada fungsinya berjalan
    pada suatu dokumen HTML, Bahasa ini adalah bahasa pemrograman untuk memberikan
    kemampuan tambahan terhadap bahasa HTML dengan mengijinkan pengeksekusian
    perintah-perintah disisi user, yang artinya disisi browser bukan di sisi server web.

    5.2.2 JavaScript Sebagai Bahasa Berorientasi Objek


    Sebuah objek tersusun atas properti, metode, dan penanganan kejadian.
    Properti
     Adalah atribut dari sebuah objek.
     Contoh Objek dalam JavaScript yaitu window. Objek ini memiliki banyak properti. Salah
    satu diantaranya adalah default Status. Properti ini menyatakan baris status yang terdapat
    pada jendela browser.
     Untuk mengakses sebuah properti, perlu penulisan dengan bentuk sebagai berikut:
    nama_objek.nama_properti,
     Contoh : Nama Objek Nama Properti

    Windows.alert

    Contoh :
    <HTML><HEAD><TITLE>PropertidefaultStatus</TITLE></HEAD>
    <BODY><H1>TesdefaultStatus</H1>
    <SCRIPT LANGUAGE = "JavaScript">
    window.alert("oklah");
    </SCRIPT></BODY></HTML>
    5.2.3 Metode
    Adalah suatu kumpulan kode yang digunakan untk melakukan sesuatu tindakan terhadap objek.
    Sebagai Contoh , Write () pada Objek document adalah metode yang digunakan untuk
    menuliskan tulisan ke jendela browser

    COntoh : Nama Objek nama metode

    document.write(“mencoba menulis dari javascript”);

    Jika Sebuah metode tidak melibatkan parameter ,tanda kurung buka dan tutup tetap harus
    disertakan . contohnya window.focus ()

    5.2.4 Pengaplikasian Event Handler


    Adalah Sekumpulan kode yang akan dijalankan jika pemakai melakukan suatu tindakan. Contoh
    kejadian adalah ketika pemakai mengklik tombol mouse atau ketika menutup jendela
    browser.
    Bentuk Penanganan kejadian adalah seperti berikut :
    Nama Kejadian = ” kumpulan kode ”
    Kumpulan kode berisi sejumlah pernyataan. Antar pernyataan dipisah dengan :
    Contoh kejadian adalah onMouseOver (ketika penunjuk mouse menunjuk ke link ) dan
    onMouseOut ( ketika penunjuk mouse tidak lagi menyorot link )

    Contoh :
    <HTML><HEAD>
    <TITLE>Kejadian</TITLE>
    </HEAD>
    <BODY>
    <H1>Java Script</H1>
    <P>Mencoba Javascript dengan perintah
    handler</P>
    <A HREF = "www.java.com"
    onMouseOut= "window.alert('Anda menyorot
    link Java Althaf')";
    onMouseOver= "window.focus()";>
    Javaku</A>
    </BODY>
    </HTML>
    5.2.5 Pengertian Jquery
    Jquery adalah library javascript yang memungkinkan kita untuk membuat program web pada
    suatu halaman web,tanpa harus secara eksplisit kita menambahkan event atau pun property pada
    halaman web tersebut.
    Dengan Jquery ,suatu halaman web yang menjadi aplikasi web,jika dilihat sourcenya ,akan
    terlihat seperti dokumen HTML biasa,tidak ada kode Javascript yang terlihat langsung.Teknik
    pemrograman web seperti ini disebut sebagai unobstrusive Javascript programming.
    Jquery merupakan salah satu library yang membuat program web dari sisi klien,tidak terlihat
    sebagai program javascript biasa,yang harus secara eksplisit disisipkan pada document web.Pada
    teknik pemrograman sisi klien dengan menggunakan javascript biasa ,setiap elemen yang akan
    memiliki event,akan secara eksplisit terlihat ada event yang dilekatkan pada elemen tersebut.Dan
    yang perlu di perhatikan adalah fitur nya yang Open source jadi kita bisa memakai untuk
    mempercantik web kita.

    5.3 Langkah Percobaan

    1. Buat skrip untuk Pengaplikasian penanganan dengan Pamasukkan Data

    Script diatas dapat dijabarkan bahwa variabel nama digunakan untuk menyimpan konstanta dari
    prompt yang message input dan menuliskannya di jendela browser setelah di OK dari button
    prompt , dengan sintaks document.write (”hai” +nama);

    Sehingga jika di browser akan di tampilkan seperti gambar di bawah ini :


    2. Buat skrip dibawah ini untuk Pengaplikasian Looping di Java script

    3. Ikuti langkah dibawah ini untuk Pengaplikasian Jquery


    Langkah-langkah yang perlu dikerjakan untuk memakai jquery di dalam website kita adalah
    sebagai berikut :
    1. Import File jquery ke dalam folder project kita (contoh : dimasukkan ke folder /js)
    2. Include kan file Jquery (jquery.js ) yang terkompresi di dalam script HTML kita dengan
    cara menuliskan seperti dibawah ini :

    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>

    3. Kita akan membuat website kita dengan memberikan library ACCOrdion dari
    jquery ,misalkan website kita seperti tampak di bawah ini

    4. Maka di script HTML nya kita tinggal memberikan /memanggil seperti tampak di bawah
    ini :
    <div id="accordion">
    <div>
    <h3><a href="#">First</a></h3>
    <div>Mencoba Accordion slide</div>
    </div>
    <div>
    <h3><a href="#">Second</a></h3>
    <div>Mencoba accordion slide untuk Mahasiswaku </div>
    </div>
    <div>
    <h3><a href="#">Third</a></h3>
    <div>Nam dui erat, auctor a, dignissim quis.</div>
    </div>
    </div>

    Maka akan nampak seperti gambar di bawah ini hasilnya nampak bagus dan ada animasinya
    :
    5.4 Tugas :
    1. Buat Javascript untuk memvalidasi Form yang di inputkan tidak bernilai
    – Warna yang anda inputkan berwarna merah
    – (Minus) dan bernilai Positif , Jika di beri nilai Negatif Maka Akan muncul Message ”
    Maaf yang anda inputkan harus Bernilai Positif ”
    – Seperti nampak pada gambar dibawah ini :

    2. Buat sebuah Layout untuk memuncul tab dengan Jquery seperti gambar di bawah
    ini :

    3. Buat sebuah Form untuk menginputkan date / tanggal dengan Jquery Script
    sehingga muncul seperti gambar di bawah ini :

    Anda mungkin juga menyukai