Scribd Logo
Unggah

Selamat datang di Scribd!

  • JQuery Bag. 3

    Diunggah oleh

    Makmur
    11 tayangan5 halaman
    Jquery

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    Jquery

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    11 tayangan5 halaman

    JQuery Bag. 3

    Diunggah oleh

    Makmur
    Jquery

    Hak Cipta:

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

    TUTORIAL

    JQUERY
    Langkah Tepat menjadi Web Designer Handal,
    menguasai JQuery JavaScript Library, jalan
    membuat halaman website lebih atraktif

    www.ilmuwebsite.com

    Bagian 3. Memulai Menguasai


    JQuery

    1
    Bagian 3. Memulai
    Menguasai JQuery
    Pada materi sebelumnya kita telah mempelajari bagaimana memulai menggunakan
    Jquery. Di sini kita akan coba mengulang materi sebelumnya. Karena dalam
    mempelajari Jquery itu memang betul-betul menyita perhatian, dan membutuhkan
    perlakuan khusus. Karena dari syntax-syntaxnya sangat-sangat membingungkan
    bagi pemula. Bukankah begitu kisanak?

    Seperti materi sebelumnya, jika Anda sudah mendownload library Jquerynya maka
    langkah selanjutnya adalah menyiapkan dokumen htmlnya.

    <!DOCTYPE html>
    <html>
    <head>
    <title>JQuery</title>
    </head>
    <body>
    <h1>Latihan JQuery Bagian 1</h1>
    <p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
    </body>
    </html>

    Kemudian kita menggunakan library javascriptnya, caranya adalah dengan


    meletakkan javascript library ke dalam tag head, menggunakan fasilitas dari html
    yakni script tag.

    <!DOCTYPE html>
    <html>
    <head>
    <title>JQuery</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    </head>
    <body>
    <h1>Latihan JQuery Bagian 1</h1>
    <p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
    </body>

    2
    </html>

    Untuk memulai memanfaatkan library javascript dimulai dengan menggunakan

    $("document").ready(function( ){

    });

    Kode tersebut diletakkan di dalam tag script yang diletakkan diantara tag head,
    setelah script yang meload library javascript, Blok kode tersebut memiliki arti,
    ketika halaman selesai di load, maka jalankan kode-kode jquerynya.

    Penggunaannya seperti ini

    <!DOCTYPE html>
    <html>
    <head>
    <title>JQuery</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
    $("document").ready(function( ){

    });
    </script>
    </head>
    <body>
    <h1>Latihan JQuery Bagian 1</h1>
    <p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
    </body>
    </html>

    Untuk membuktikan apakah sudah betul proses pemanggilan library javascript dan
    penulisan jquerynya, kita bisa memanfaatkan alert('tes jquery').

    <!DOCTYPE html>
    <html>
    <head>
    <title>JQuery</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
    $("document").ready(function( ){

    3
    alert('tes jquery');
    });
    </script>
    </head>
    <body>
    <h1>Latihan JQuery Bagian 1</h1>
    <p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
    </body>
    </html>

    Hasil dari kode tersebut adalah, akan muncul kotak dialog bertuliskan tes jquery.
    Ketika sudah muncul kotak dialog bertuliskan tes jquery, ini berarti Anda telah
    berhasil dalam memanggil library javascript dan juga penulisan kode jquerynya.

    Selain menggunakan ...

    $("document").ready(function( ){

    });

    Pada umumnya programmer menyingkatnya menjadi

    $(function(){

    });

    Contoh lengkapnya adalah seperti ini

    <!DOCTYPE html>
    <html>
    <head>
    <title>JQuery</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
    $(function( ){
    alert('tes jquery');
    });
    </script>
    </head>

    4
    <body>
    <h1>Latihan JQuery Bagian 1</h1>
    <p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
    </body>
    </html>

    Anda mungkin juga menyukai