Js - js tutorial
- html js - js script - js html
Js
adalah
singkatan dari JavaScript
JavaScript
Dilihat
dari namanya yang menggunakan kata “Java” yang jika diartikan ke dalam bahasa
Indonesia yaitu Jawa, banyak orang yang menyangka jika script ini berasal dari
bahasa Jawa. Prasangka ini sangat jauh sekali jika kita mempelajari script ini.
Tidak ada sepatah kata pun yang berasal dari bahasa Jawa dalam script ini.
Dalam
blogosphere, JavaScript sangat dikenal dengan script yang bisa bikin gendut
blog kita dan dapat membuat loading blog menjadi berat. Banyak yang sudah kenal
dengan JavaScript, tetapi banyak juga yang belum tahu apa itu JavaScript.
Oleh karena itu, ayo kita kupas tuntas.
Menurut Wikipedia, JavaScript adalah
bahasa scripting yang popular di internet dan dapat bekerja di sebagian besar
browser popular seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan
Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag
SCRIPT.
Yang
pertama kali merancang JavaScript adalah perusahaan bernama Netscape Navigator
yang ingin melengkapi fitur browser miliknya -Navigator- yang sebelumnya telah
mendukung Java untuk lebih bisa dimanfaatkan para programmer yang non-Java.
JavaScript
biasanya diletakkan pada bagian antara tag <head> dan </head> dan
dimulai dengan tag <script type="teks/javascript"> diakhiri
dengan tag </script>
Contoh
JavaScript
<script
type="teks/javascript">
alert("Halo
Dunia!");
</script>
File JavaScript biasanya terletak di file tersendiri yang berektensi *.js dan dipanggil dengan cara menentukan nama file lalu dimasukkan dalam tag <script type="teks/javascript" src="nama_file.js"></script> Maka dikembangkanlah bahasa pemrograman bernama LiveScript untuk mengakomodasi hal tersebut. Bahasa pemrograman inilah yang akhirnya berkembang dan diberi nama JavaScript, walaupun tidak ada hubungan bahasa antara Java dengan JavaScript.
File JavaScript biasanya terletak di file tersendiri yang berektensi *.js dan dipanggil dengan cara menentukan nama file lalu dimasukkan dalam tag <script type="teks/javascript" src="nama_file.js"></script> Maka dikembangkanlah bahasa pemrograman bernama LiveScript untuk mengakomodasi hal tersebut. Bahasa pemrograman inilah yang akhirnya berkembang dan diberi nama JavaScript, walaupun tidak ada hubungan bahasa antara Java dengan JavaScript.
html js - js html - js script
Penulisan JavaScript
Kode JavaScript biasanya dituliskan
dalam bentuk fungsi yang ditaruh di tag <head> yang dibuka dengan tag <script
type="text/javascript">.
<script type="text/javascript">
alert("Halo
Dunia!");
</script>
Kode
JavaScript juga bisa diletakkan di file tersendiri yang berekstensi .js
(singkatan dari JavaScript). Untuk
memanggil kode JavaScript yang terdapat di file sendiri, di bagian awal
<head> harus ditentukan dahulu nama file .js yang dimaksud menggunakan
contoh kode seperti berikut:
<script type="text/javascript" src="alamat.js">
</script>
Skrip
di head
Skrip
ini akan dieksekusi ketika dipanggil (biasanya berbentuk function) atau
dipanggil berdasarkan trigger pada event tertentu. Peletakkan
skrip di head akan menjamin skrip dimuat terlebih dahulu sebelum
dipanggil.
<html>
<head>
<script type="text/javascript">
...
</script>
</head>
</html>
Skrip
di body
Skrip
ini dieksekusi ketika halaman dimuat sampai di bagian <body>. Ketika
menempatkan skrip pada bagian <body> berarti antara isi dan JavaScript
dijadikan satu bagian.
<html>
<head>
</head>
<body>
<script type="text/javascript">
...
</script>
</body>
</html>
Jumlah
JavaScript di <head> dan <body> yang ditempatkan pada dokumen tidak
terbatas.
Skrip
eksternal
Terkadang
ada yang menginginkan menjalankan JavaScript yang sama dalam beberapa kali pada
halaman yang berbeda, tetapi tidak mau disibukkan jika harus menulis ulang
script yang diinginkan di setiap halaman. Maka JavaScript dapat ditulis di file
secara eksternal. Jadi, antara dokumen HTML dan JavaScript dipisahkan, kemudian
berkas tersebut dipanggil dari dokument HTML. Berkas JavaScript tersebut
disimpan dengan ekstensi .js.
JavaScript :
js/xxx.js document.write("pesan ini
tampil ketika halaman diload");
Untuk
menggunakan eksternal JavaScript (.js) dipakai atribut "src" pada tag
<script> pada halaman HTML-nya.
<html>
<head>
</head>
<body>
<script src="xxx.js">
</script>
<p>Script di atas berada di berkas "xx.js"
(eksternal) </p>
</body>
</html>
Manfaat, Fungsi & Peran JavaScript
Seperti
yang disebutkan diatas, javascript berfungsi membuat sebuah halaman website
lebih interaktif dan dinamis. Penggunaan kode javascript sangat dibutuhkan
untuk website-website yang berorientasi pada kenyamanan pengakses
(user-experience). Namun, penggunaan kode javascript ini tidak akan maksimal
jika tidak dibarengi dengan penggunaan CSS karena javascript juga tidak
akan lepas dari HTML.
Ketiga
bahasa pemrograman itu sangat erat kaitannya. Jika saya ibaratkan sebuah
website adalah rumah, maka kode HTML adalah segala yang membangun dan ada
dirumah tersebut (tembok, tiang, atap, pondasi, ruang keluarga, kamar, dapur,
peralatan rumah tangga, dan sebagainya). Lalu, kode CSS adalah pengatur dan
penghias rumah tersebut(tata letak, warna dan sebagainya). Dan peran javascript
bisa sebagai ‘pembantu’ kode CSS agar pengaturan dan hiasannya lebih bagus
dengan tambahan pernak-pernik misalnya. Bisa juga untuk memanipulasi kode HTML
dengan nama/identitas tertentu. Manipulasi ini bisa berupa menyembunyikan,
menganti bahkan menambahkan elemen HTML yang baru.
Tanpa
javascript, saat melakukan aksi tertentu, misalnya meng-klik pada sebuah
halaman website, maka hasil atau respon dari hasil klik tersebut harus
dimuat pada halaman lain. Hal ini tentunya sangat merepotkan karena tidak
setiap aksi klik menghasilkan hasil/output yang besar/banyak. Terkadang hasil
sebuah aksi hanyalah sebuah kalimat “Anda berhasil memasukkan data”, misalnya.
Catatan
Tambahan
- Hampir semua website saat ini menggunakan javascript, tapi ketahuilah bahwa pengakses website bisa mematikan fitur javascript pada browsernya, sehingga website yang diakses akan tampil sebagaimana tampil tanpa javascript. Hal ini bisa membuat tampilan website anda acak-acakan jika anda terlalu bergantung pada kode javascript untuk mendesainnya.
- Penggunaan javascript yang terlalu banyak dan tidak rapi dapat membuat loading website anda lambat dan berat. Jadi, gunakan sewajarnya.
Perbedaan JavaScript dan jQuery
Apa sih JavaScript dan jQuery
itu? Berikut ini saya akan berbagi tentang apa Perbedaan JavaScript dan jQuery
tersebut.
Nama JavaScript agak menyesatkan
karena mirip dengan platform untuk software Java milik Oracle. Padahal tidak
berhubungan sama sekali, dan juga JavaScript bukan scripting language*.
Secara umum JavaScript dipergunakan
untuk memanipulasi “Document Object Model” (DOM), yang meliputi elemen-elemen
pada sebuah laman web. Jadi, sebuah bahasa pemrograman yang dirancang untuk
penggunaan pada browser (peramban) web.
JavaScript dieksekusi pada client
side (sisi pengguna = komputer pengguna): Sebuah server website mengirim
JavaScript ke peramban milik pengguna, dan perambah tersebut menginterpretasikan dan menjalankan
kodenya. Semua ini terjadi dalam sebuah sandbox, yang menjaga agar JavaScript
tidak menyentuh internal sistem dan mencegah malicious code (kode jahat)
menginfeksi komputer pengguna.
Sedangkan jQuery adalah sebuah
komponen/librari/framework (kamus atau perpustakaan) yang dibuat dari
JavaScript dengan tujuan memudahkan seorang programmer dalam menggunakan
fungsi-fungsi yang lebih rumit. Dengan jquery, seorang programmer bisa lebih
leluasa dan mudah melakukan kontrol, manipulasi, automasi halaman web. Oleh
karena kemudahan tersebut jQuery memiliki semboyan "write less, do
more" yang bisa kita artikan dengan sedikit menulis kode tapi
dapat melakukan banyak hal.
Jquery dibangun dengan berorientasi
objek sehingga akan lebih optimal dan memiliki kemampuan yang lebih luas untuk
menciptakan serta memanipulasi halaman web. Karena berorientasi pada objek maka
jQuery lebih berkaitan dengan tampilan halaman web.
Meskipun ada banyak library lain
semacamnya, namun jQuery jauh lebih populer karena kemampuannya untuk
menjalankan perintah pada peramban lama. jQuery berjalan pada browser bersamaan
dengan JavaScript biasa. Ia terutama dipergunakan untuk animasi dan AJAX, yang
cukup sulit untuk diprogramkan dengan vanilla JavaScript, namun bisa diketik
dalam beberapa baris singkat dengan jQuery.
jQuery dimasukkan dalam sebuah laman web diantara tag <script> dan tag </script>;
jQuery dimasukkan dalam sebuah laman web diantara tag <script> dan tag </script>;
contohnya: <script src=”…/ajax/libs/jquery/1.11.1/jquery.min.j”></script>.
Penulisan kode untuk fungsi jQuery di atas adalah:
Penulisan kode untuk fungsi jQuery di atas adalah:
<script>
$("#box").click(function(){$("#box").slideUp()});
</script>
Mari kita lihat contoh lainnya. Bagaimana penulisan JavaScript dan jQuery untuk melakukan sebuah manipulasi background dokumen html berikut :
Javascript
<script language="javascript">
function changeBackground(color)
{
document.body.style.background = color;
}
onload="changeBackground('red');"
</script>
Jquery
<script>
$('body').css('background',
'#ccc');
</script>
Keduanya sama-sama memerintahkan web
browser untuk menampilkan background (latar belakang) "body" berwarna
merah.
jQuery itu library-nya, JavaScript
bahasanya
jQuery
juga memiliki banyak sekali plugin yang memperluas fungsionalitasnya melalui
berbagai metode.
js tutorial
Para sahabat...
Jika Para sahabat mau
bisa membuat website secara profesional. maka disinilah para
sahabat bisa mengali ilmu secara gratis. Karena Penulis akan membahas
semua materi pembuatan website di dalam blog ini.
Catatan :
silahkan lihat daftar isi
materi membuat website, silahkan klik disini.
Demikian informasinya, semoga dapat bermanfaat untuk para sahabat.