P. 1
Makalah Java

Makalah Java

|Views: 3,332|Likes:
Published by hartoyo
Untuk melengkapi tugas pertama mata kuliah Pemrograman Java
Untuk melengkapi tugas pertama mata kuliah Pemrograman Java

More info:

Published by: hartoyo on Oct 17, 2009
Copyright:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as RTF or read online from Scribd
See more
See less

04/16/2014

JAVA SCRIPT 1. JAVA HOME JavaScript adalah bahasa scripting THE dari Web.

JavaScript digunakan di jutaan halaman web untuk menambah fungsionalitas, memvalidasi bentuk, mendeteksi browser, dan banyak lagi. CONTOH <html> <body> <script type="text/javascript"> document.write("This is my first JavaScript!"); </script> </body> </html> 2. Java Introduce JavaScript adalah bahasa scripting paling populer di internet, dan bekerja di semua browser utama, seperti Internet Explorer, Firefox, Chrome, Opera, dan Safari. sebelum Anda melanjutkan, Anda harus memiliki pemahaman dasar berikut: * HTML / XHTML Apa itu JavaScript? * JavaScript didesain untuk menambah interaktivitas ke halaman HTML * JavaScript adalah bahasa scripting * Sebuah bahasa scripting adalah bahasa pemrograman yang ringan * JavaScript biasanya embedded langsung ke dalam halaman HTML * JavaScript adalah bahasa ditafsirkan (berarti bahwa script yang mengeksekusi tanpa pendahuluan kompilasi) * Setiap orang dapat menggunakan JavaScript tanpa membeli lisensi Apakah Java dan JavaScript sama? NO! Java dan JavaScript adalah dua bahasa yang sama sekali berbeda baik dalam konsep dan desain! Java (dikembangkan oleh Sun Microsystems) adalah yang kuat dan jauh lebih kompleks bahasa pemrograman - dalam kategori yang sama dengan C dan C + +. Apa yang dapat JavaScript lakukan? * JavaScript memberikan desainer HTML alat pemrograman - penulis HTML biasanya bukan programmer, tapi JavaScript adalah bahasa scripting dengan sintaks yang sangat sederhana! Hampir setiap orang dapat meletakkan kecil "potongan" kode ke dalam halaman HTML * JavaScript dapat memasukkan teks dinamis ke dalam halaman HTML - Sebuah JavaScript pernyataan seperti ini: document.write ( "<h1>" + nama + "</ h1>") dapat menuliskan sebuah teks variabel ke dalam halaman HTML

* JavaScript dapat bereaksi terhadap events - A JavaScript dapat diatur untuk mengeksekusi ketika sesuatu terjadi, seperti ketika sebuah halaman telah selesai dimuat atau ketika pengguna mengklik pada sebuah elemen HTML * JavaScript dapat membaca dan menulis elemen HTML - Sebuah JavaScript dapat membaca dan mengubah isi elemen HTML * JavaScript dapat digunakan untuk memvalidasi data - A JavaScript dapat digunakan untuk memvalidasi data formulir sebelum diserahkan ke server. Ini menghemat server dari pemrosesan tambahan * JavaScript dapat digunakan untuk mendeteksi browser pengunjung - Sebuah JavaScript dapat digunakan untuk mendeteksi browser pengunjung, dan - tergantung pada browser - load halaman lain yang khusus dirancang untuk browser * JavaScript dapat digunakan untuk membuat cookies - A JavaScript dapat digunakan untuk menyimpan dan mengambil informasi di komputer pengunjung The Real Name is ECMAScript JavaScript nama resmi ECMAScript. ECMAScript dikembangkan dan dikelola oleh organisasi ECMA. ECMA-262 adalah standar JavaScript resmi. Bahasa ini diciptakan oleh Brendan Eich at Netscape (dengan Navigator 2.0), dan telah muncul di semua browser Netscape dan Microsoft sejak tahun 1996. Pengembangan ECMA-262 dimulai pada 1996, dan edisi pertama diadopsi oleh Majelis Umum ECMA pada bulan Juni 1997. Standar ini disetujui sebagai ISO internasional (ISO / IEC 16262) standar pada tahun 1998. Pengembangan standar masih berlangsung. 3. Java Script How To <script> Tag HTML digunakan untuk menyisipkan JavaScript ke dalam halaman HTML. Masukkan JavaScript ke dalam halaman HTML Contoh di bawah ini menunjukkan bagaimana menggunakan JavaSript untuk menulis teks pada halaman web: <html> <body> <script type="text/javascript"> document.write("Hello World!"); </script> </body> </html> Contoh di bawah ini menunjukkan bagaimana cara menambahkan tag HTML ke JavaScript: <html> <body> <script type="text/javascript"> document.write("<h1>Hello World!</h1>"); </script>

</body> </html> Contoh Dijelaskan Untuk menyisipkan JavaScript ke dalam halaman HTML, kita menggunakan tag <script>. Di dalam tag <script> kita menggunakan jenis atribut untuk mendefinisikan bahasa scripting. Jadi, <script type="text/javascript"> dan </ script> memberitahu tempat dimulai dan berakhir JavaScript: <html> <body> <script type="text/javascript"> ... </script> </body> </html> dia perintah document.write JavaScript merupakan standar output perintah untuk menulis ke halaman. Dengan memasukkan perintah document.write antara <script> dan </ script> tag, browser akan mengenalinya sebagai perintah JavaScript dan mengeksekusi kode baris. Dalam hal ini browser akan menulis Hello World! ke halaman: <html> <body> <script type="text/javascript"> document.write("Hello World!"); </script> </body> </html> Catatan: Jika kita tidak memasuki <script> tag, browser akan memperlakukan document.write ( "Hello World!") Perintah sebagai teks murni, dan hanya menulis seluruh baris pada halaman. Mencobanya sendiri Bagaimana Menangani Wikipedia Browser Browser yang tidak mendukung JavaScript, JavaScript sebagai akan menampilkan konten halaman. Untuk mencegah mereka dari melakukan hal ini, dan sebagai bagian dari standar JavaScript, HTML tag comment harus digunakan untuk "menyembunyikan" JavaScript. Hanya menambahkan tag komentar HTML <! - Sebelum pernyataan pertama JavaScript, dan seorang -> (akhir komentar) setelah pernyataan JavaScript terakhir, seperti ini: <html> <body> <script type="text/javascript"> <!-document.write("Hello World!"); //--> </script>

</body> </html> Dua garis miring maju di akhir baris komentar (/ /) adalah komentar JavaScript simbol. Hal ini untuk mencegah dari menjalankan JavaScript -> tag. 4. Java Script Where To JavaScripts dalam bagian tubuh akan dilaksanakan SAAT halaman load. JavaScripts di bagian kepala akan dijalankan ketika menelepon. Dimana Letakkan JavaScript JavaScripts dalam halaman akan dilaksanakan segera ketika halaman load ke browser. Ini tidak selalu apa yang kita inginkan. Kadang-kadang kita ingin mengeksekusi sebuah script ketika halaman load, lain kali bila pengguna memicu suatu peristiwa. Skrip di <head> Skrip yang akan dijalankan ketika mereka dipanggil, atau ketika sebuah peristiwa dipicu, pergilah di bagian kepala. Jika Anda menempatkan script di bagian kepala, Anda akan memastikan bahwa script tersebut dimuat sebelum ada yang menggunakannya. <html> <head> <script type="text/javascript"> function message() { alert("This alert box was called with the onload event"); } </script> </head> <body onload="message()"> </body> </html> Skrip di <body> Skrip yang akan dijalankan ketika halaman load pergi di bagian tubuh. Jika Anda menempatkan script bagian dalam tubuh, itu menghasilkan konten halaman. <html> <head> </head> <body> <script type="text/javascript"> document.write("This message is written by JavaScript"); </script> </body>

</html> Skrip di <head> dan <body> Anda dapat menempatkan jumlah tidak terbatas skrip dalam dokumen Anda, sehingga Anda dapat memiliki skrip baik di tubuh dan bagian kepala. <html> <head> <script type="text/javascript"> .... </script> </head> <body> <script type="text/javascript"> .... </script> </body> Menggunakan External JavaScript Jika Anda ingin menjalankan JavaScript yang sama pada beberapa halaman, tanpa harus menulis naskah yang sama pada setiap halaman, Anda dapat menulis JavaScript dalam sebuah file eksternal. Simpan file JavaScript eksternal dengan. Js ekstensi file. Catatan: skrip eksternal tidak dapat berisi tag <script>! Untuk menggunakan skrip eksternal, arahkan ke. Js file dalam "src" attribute dari tag <script>: <html> <head> <script type="text/javascript" src="xxx.js"></script> </head> <body> </body> </html> 5. Java Script Statemants JavaScript adalah suatu urutan pernyataan yang akan dijalankan oleh browser. JavaScript is Case Sensitive Tidak seperti HTML, JavaScript kasus sensitif - karena itu melihat dari dekat kapitalisasi Anda ketika Anda menulis pernyataan JavaScript, membuat atau memanggil variabel, objek dan fungsi. JavaScript Statements Sebuah pernyataan JavaScript adalah perintah untuk browser. Tujuan dari perintah ini adalah untuk memberitahu browser apa yang harus dilakukan. Pernyataan JavaScript ini menginformasikan kepada browser untuk menulis "Hello Dolly" ke halaman web:

document.write("Hello Dolly"); Hal yang biasa untuk menambahkan tanda titik koma di akhir setiap pernyataan dieksekusi. Kebanyakan orang berpikir bahwa ini adalah praktek pemrograman yang baik, dan yang paling sering Anda akan melihat ini dalam JavaScript contoh di web. Titik koma adalah opsional (menurut standar JavaScript), dan browser seharusnya menafsirkan akhir baris sebagai akhir pernyataan. Karena ini, Anda akan sering melihat contoh tanpa titik koma di akhir. Catatan: Menggunakan titik koma memungkinkan untuk menulis banyak pernyataan dalam satu baris. Kode JavaScript Kode JavaScript (atau hanya JavaScript) adalah serangkaian pernyataan JavaScript. Setiap pernyataan yang dijalankan oleh browser dalam urutan yang tertulis. Contoh ini akan menulis sebuah heading dan dua paragraf ke sebuah halaman web: <script type="text/javascript"> document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); </script> JavaScript Blocks JavaScript pernyataan dapat dikelompokkan bersama dalam blok. Blok mulai dengan keriting kiri Braket (, dan berakhir dengan hak keriting Braket). Tujuan dari blok adalah membuat pernyataan urutan melaksanakan bersama. Contoh ini akan menulis sebuah heading dan dua paragraf ke sebuah halaman web: <script type="text/javascript"> { document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); } </script> Contoh di atas ini tidak terlalu berguna. Itu hanya menunjukkan penggunaan blok. Biasanya digunakan untuk blok grup pernyataan bersama dalam suatu fungsi atau dalam kondisi (di mana sekelompok pernyataan harus dieksekusi jika kondisi terpenuhi). Anda akan belajar lebih banyak tentang fungsi dan kondisi di bab-bab selanjutnya. 6. Java Script Commants Komentar JavaScript dapat digunakan untuk membuat kode lebih mudah dibaca. JavaScript Komentar

Komentar dapat ditambahkan untuk menjelaskan JavaScript, atau untuk membuat kode lebih mudah dibaca. Satu baris komentar dimulai dengan / /. Contoh berikut ini menggunakan satu baris komentar untuk menjelaskan kode: <script type="text/javascript"> // Write a heading document.write("<h1>This is a heading</h1>"); // Write two paragraphs: document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); </script> JavaScript Multi-Line Komentar Multi baris komentar dimulai dengan / * dan diakhiri dengan * /. Contoh berikut ini menggunakan garis multi komentar untuk menjelaskan kode: <script type="text/javascript"> /* The code below will write one heading and two paragraphs */ document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); </script> Menggunakan Komentar Untuk Mencegah Eksekusi Pada contoh berikut komentar digunakan untuk mencegah eksekusi kode dari satu baris (dapat cocok untuk debugging): <script type="text/javascript"> //document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); </script> Pada contoh berikut komentar digunakan untuk mencegah eksekusi sebuah blok kode (dapat cocok untuk debugging): <script type="text/javascript"> /* document.write("<h1>This is a heading</h1>"); document.write("<p>This is a paragraph.</p>"); document.write("<p>This is another paragraph.</p>"); */ </script> Menggunakan Komentar di End of a Line

Pada contoh berikut komentar yang diletakkan di akhir baris kode: <script type="text/javascript"> document.write("Hello"); // Write "Hello" document.write(" Dolly!"); // Write " Dolly!" </script> 7. Java Script Variabel Variabel adalah "wadah" untuk menyimpan informasi. Do You Remember Aljabar Dari Sekolah? Apakah Anda ingat aljabar dari sekolah? x = 5, y = 6, z = x + y Apakah Anda ingat bahwa sebuah surat (seperti x) dapat digunakan untuk menyimpan nilai (seperti 5), dan bahwa Anda bisa menggunakan informasi di atas untuk menghitung nilai z menjadi 11? Surat-surat ini disebut variabel, dan variabel dapat digunakan untuk menyimpan nilai (x = 5) atau ungkapan (z = x + y). Variabel JavaScript Seperti aljabar, variabel JavaScript digunakan untuk menyimpan nilai atau ekspresi. Sebuah variabel dapat memiliki nama pendek, seperti x, atau nama yang lebih deskriptif, seperti carname. Aturan untuk JavaScript nama variabel: * Nama-nama variabel adalah case sensitif (y dan Y adalah dua variabel yang berbeda) * Nama-nama variabel harus dimulai dengan huruf atau karakter garis bawah Catatan: Karena JavaScript case-sensitif, nama variabel adalah case-sensitive. Contoh Sebuah nilai variabel dapat berubah selama eksekusi sebuah naskah. Anda dapat merujuk ke variabel dengan nama untuk menampilkan atau mengubah nilainya. Deklarasi (Menciptakan) Variabel JavaScript Membuat variabel pada JavaScript yang paling sering disebut sebagai "menyatakan" variabel. Anda dapat mendeklarasikan variabel JavaScript dengan pernyataan var: var x; var carname; Setelah deklarasi yang ditunjukkan di atas, variabel kosong (mereka tidak memiliki nilai nilai). Namun, Anda juga dapat menetapkan nilai ke variabel ketika Anda menyatakan mereka: var x=5; var carname="Volvo";

Setelah pelaksanaan pernyataan di atas, variabel x akan memegang nilai 5, dan akan terus carname nilai Volvo. Catatan: Bila Anda menetapkan nilai teks ke variabel, gunakan tanda kutip di nilai. Menetapkan Nilai ke Variabel JavaScript dipercayai memiliki Jika Anda memberikan nilai pada variabel yang belum dideklarasikan, variabel akan secara otomatis dinyatakan. Pernyataan-pernyataan ini: x=5; carname="Volvo"; var x=5; var carname="Volvo"; Variabel JavaScript Redeclaring Jika Anda JavaScript redeclare variabel tersebut, maka tidak akan kehilangan nilai aslinya. var x=5; var x; Setelah pelaksanaan pernyataan di atas, variabel x akan masih memiliki nilai 5. Nilai x tidak diatur ulang (atau dihapus) ketika Anda redeclare itu. JavaScript Arithmetic Seperti aljabar, Anda dapat melakukan operasi aritmatika dengan variabel JavaScript: y=x-5; z=y+5; Anda akan mempelajari lebih lanjut tentang operator yang dapat digunakan pada bab selanjutnya dari tutorial ini. 8. Java Script Operator = Digunakan untuk menetapkan nilai. + Adalah digunakan untuk menambah nilai. Tugas operator = digunakan untuk memberikan nilai pada variabel JavaScript. Aritmetik operator + digunakan untuk menambah nilai-nilai bersama. y=5; z=2; x=y+z; Nilai x, setelah pelaksanaan pernyataan di atas adalah 7.

JavaScript Arithmetic Operator Operator aritmatika digunakan untuk melakukan aritmatika antara variabel-variabel dan / atau nilai-nilai. Mengingat bahwa y = 5, tabel di bawah ini menjelaskan operator aritmetik: Operator Description Example Result + Addition x=y+2 x=7 Subtraction x=y-2 x=3 * Multiplication x=y*2 x=10 / Division x=y/2 x=2.5 % Modulus (division remainder) x=y%2 x=1 ++ Increment x=++y x=6 -Decrement x=--y x=4 JavaScript Assignment Operator Assignment operator digunakan untuk memberikan nilai pada variabel JavaScript. Mengingat bahwa x = 10 dan y = 5, tabel di bawah ini menjelaskan operator penugasan: Operator = x=y += x+=y -= x-=y *= x*=y /= x/=y %= x%=y Example x=5 x=x+y x=15 x=x-y x=5 x=x*y x=50 x=x/y x=2 x=x%y x=0 Same As Result

The + operator Digunakan pada Strings Operator + juga dapat digunakan untuk menambahkan variabel string atau nilai-nilai teks bersama-sama. Untuk menambahkan dua atau lebih string variabel bersama, gunakan operator +. txt1="What a very"; txt2="nice day"; txt3=txt1+txt2; Setelah pelaksanaan pernyataan di atas, variabel txt3 berisi "Sungguh hari verynice". Untuk menambahkan spasi di antara dua senar, menyisipkan spasi ke salah satu string: txt1="What a very "; txt2="nice day"; txt3=txt1+txt2; atau menyisipkan spasi ke dalam ekspresi: txt1="What a very"; txt2="nice day"; txt3=txt1+" "+txt2;

Setelah pelaksanaan pernyataan di atas, variabel txt3 berisi: "Apa yang sangat nice day" Menambahkan Strings dan Bilangan Peraturannya adalah: Jika anda menambahkan sebuah nomor dan sebuah string, hasilnya akan menjadi string! x=5+5; document.write(x); x="5"+"5"; document.write(x); x=5+"5"; document.write(x); x="5"+5; document.write(x); 9. JavaScript Comparison and Logical Operators (JavaScript Perbandingan dan Logical Operator) Perbandingan dan Logical operator digunakan untuk menguji benar atau salah. Operator Perbandingan Perbandingan operator digunakan dalam pernyataan-pernyataan logis untuk menentukan kesetaraan atau perbedaan antara variabel-variabel atau nilai. Mengingat bahwa x = 5, tabel di bawah ini menjelaskan operator perbandingan: Operator Description Example == is equal to x==8 is false === is exactly equal to (value and type) x===5 is true x==="5" is false != is not equal x!=8 is true > is greater than x>8 is false < is less than x<8 is true >= is greater than or equal to x>=8 is false <= is less than or equal to x<=8 is true Bagaimana alat ini dapat Digunakan Perbandingan operator dapat digunakan dalam pernyataan bersyarat untuk membandingkan nilai-nilai dan mengambil tindakan tergantung pada hasil: if (age<18) document.write("Too young"); Anda akan belajar lebih banyak tentang penggunaan pernyataan bersyarat dalam bab selanjutnya dari tutorial ini.

Logical Operator Operator logika digunakan untuk menentukan logika antara variabel-variabel atau nilai. Mengingat bahwa x = 6 dan y = 3, tabel di bawah ini menjelaskan operator logis: Operator && and || or ! not Description Example (x < 10 && y > 1) is true (x==5 || y==5) is false !(x==y) is true

Operator kondisional JavaScript juga berisi sebuah operator kondisional yang memberikan nilai ke variabel didasarkan pada beberapa kondisi. Sintaks variablename=(condition)?value1:value2 Example greeting=(visitor=="PRES")?"Dear President ":"Dear "; Jika variabel pengunjung memiliki nilai "Pres", maka variabel tersebut akan diarahkan ucapan nilai "Dear Presiden" lain akan ditugaskan "Ya". 10. JavaScript If...Else Statements Pernyataan bersyarat digunakan untuk melakukan tindakan yang berbeda yang didasarkan pada kondisi yang berbeda. Conditional Statements Sangat sering bila Anda menulis kode, Anda ingin melakukan tindakan yang berbeda untuk keputusan yang berbeda. Anda dapat menggunakan pernyataan kondisional dalam kode Anda untuk melakukan hal ini. Dalam JavaScript kita memiliki pernyataan kondisional berikut: * Jika pernyataan - menggunakan pernyataan ini untuk menjalankan beberapa kode hanya jika kondisi yang ditentukan benar * Jika ... lain pernyataan - menggunakan pernyataan ini untuk mengeksekusi beberapa kode jika kondisi benar dan kode lain jika kondisi salah * Jika ... else if .... pernyataan lain - menggunakan pernyataan ini untuk memilih salah satu dari banyak blok kode yang akan dieksekusi * Beralih pernyataan - menggunakan pernyataan ini untuk memilih salah satu dari banyak blok kode yang akan dieksekusi Jika Statement Gunakan jika pernyataan untuk mengeksekusi beberapa kode hanya jika kondisi yang ditentukan benar. Syntax if (condition)

{ code to be executed if condition is true } Perhatikan bahwa jika ditulis dalam huruf kecil. Menggunakan huruf besar (IF) akan menghasilkan kesalahan JavaScript! <script type="text/javascript"> //Write a "Good morning" greeting if //the time is less than 10 var d=new Date(); var time=d.getHours(); if (time<10) { document.write("<b>Good morning</b>"); } </script> Perhatikan bahwa tidak ada .. lain .. sintaks ini. Anda memberitahu browser untuk mengeksekusi beberapa kode hanya jika kondisi tertentu adalah benar. If...else Statement Gunakan jika pernyataan .... lain untuk mengeksekusi beberapa kode jika kondisi benar dan kode lain jika kondisi tidak benar. Sintaks if (condition) { code to be executed if condition is true } else { code to be executed if condition is not true } Example <script type="text/javascript"> //If the time is less than 10, you will get a "Good morning" greeting. //Otherwise you will get a "Good day" greeting. var d = new Date(); var time = d.getHours(); if (time < 10) { document.write("Good morning!"); } else { document.write("Good day!"); } </script>

If...else if...else Statement Gunakan if .... else if ... lain pernyataan untuk memilih salah satu dari beberapa blok kode yang akan dieksekusi. Syntax if (condition1) { code to be executed if condition1 is true } else if (condition2) { code to be executed if condition2 is true } else { code to be executed if condition1 and condition2 are not true } Example <script type="text/javascript"> var d = new Date() var time = d.getHours() if (time<10) { document.write("<b>Good morning</b>"); } else if (time>10 && time<16) { document.write("<b>Good day</b>"); } else { document.write("<b>Hello World!</b>"); } </script> 11. Switch Pernyataan bersyarat digunakan untuk melakukan tindakan yang berbeda yang didasarkan pada kondisi yang berbeda Switch JavaScript Pernyataan Gunakan pernyataan switch untuk memilih salah satu dari banyak blok kode yang akan dieksekusi. Syntax switch(n) { case 1: execute code block 1 break; case 2: execute code block 2

break; default: code to be executed if n is different from case 1 and 2 } Ini adalah cara kerjanya: Pertama kita memiliki satu ekspresi n (paling sering sebuah variabel), yang dievaluasi sekali. Nilai dari ekspresi ini kemudian dibandingkan dengan nilai-nilai untuk setiap kasus dalam struktur. Jika ada kesesuaian, blok kode yang terkait dengan kasus itu dijalankan. Gunakan istirahat untuk mencegah kode dari berlari ke kasus berikutnya secara otomatis. Example <script type="text/javascript"> //You will receive a different greeting based //on what day it is. Note that Sunday=0, //Monday=1, Tuesday=2, etc. var d=new Date(); theDay=d.getDay(); switch (theDay) { case 5: document.write("Finally Friday"); break; case 6: document.write("Super Saturday"); break; case 0: document.write("Sleepy Sunday"); break; default: document.write("I'm looking forward to this weekend!"); } </script> 12. JavaScript Popup Boxes JavaScript memiliki tiga macam kotak popup: Alert box, Confirm box, dan Prompt box Alert Box Kotak peringatan yang sering digunakan jika Anda ingin memastikan informasi yang datang melalui kepada pengguna. Ketika kotak peringatan muncul, pengguna juga harus klik "OK" untuk melanjutkan. Syntax alert("sometext"); Example <html> <head> <script type="text/javascript"> function show_alert() {

alert("I am an alert box!"); } </script> </head> <body> <input type="button" onclick="show_alert()" value="Show alert box" /> </body> </html> Konfirmasi Box Sebuah kotak konfirmasi sering digunakan jika Anda ingin pengguna untuk memverifikasi atau menerima sesuatu. Ketika muncul kotak konfirmasi, pengguna harus mengklik "OK" atau "Batal" untuk melanjutkan. Jika pengguna mengklik "OK", kotak returns true. Jika pengguna mengklik "Batal", kotak returns false. Syntax confirm("sometext"); Example <html> <head> <script type="text/javascript"> function show_confirm() { var r=confirm("Press a button"); if (r==true) { document.write("You pressed OK!"); } else { document.write("You pressed Cancel!"); } } </script> </head> <body> <input type="button" onclick="show_confirm()" value="Show confirm box" /> </body> </html> Prompt Box Sebuah kotak prompt sering digunakan jika Anda ingin user untuk input nilai sebelum memasuki sebuah halaman. Ketika sebuah kotak prompt muncul, pengguna harus mengklik "OK" atau "Batal" untuk

melanjutkan setelah memasukkan nilai sebuah input. Jika pengguna mengklik "OK" kotak mengembalikan nilai input. Jika pengguna mengklik "Batal" kotak kembali null. Syntax prompt("sometext","defaultvalue"); Example <html> <head> <script type="text/javascript"> function show_prompt() { var name=prompt("Please enter your name","Harry Potter"); if (name!=null && name!="") { document.write("Hello " + name + "! How are you today?"); } } </script> </head> <body> <input type="button" onclick="show_prompt()" value="Show prompt box" /> </body> </html> 13. JavaScript Functions Fungsi JavaScript Untuk menjaga browser dari mengeksekusi sebuah script ketika halaman load, Anda dapat menempatkan script Anda ke dalam suatu fungsi. Sebuah fungsi berisi kode yang akan dijalankan oleh sebuah peristiwa atau oleh panggilan ke fungsi. Anda dapat memanggil fungsi dari mana saja di dalam suatu halaman (atau bahkan dari halaman lain jika fungsi tertanam dalam eksternal. Js file). Fungsi dapat didefinisikan baik dalam <head> dan <badan> bagian dari sebuah dokumen. Namun, untuk memastikan bahwa fungsi dibaca / dibuka oleh browser sebelum itu disebut, bisa bijaksana untuk menempatkan fungsi dalam bagian <kepala>. Bagaimana Menetapkan Fungsi Syntax function functionname(var1,var2,...,varX) { some code }

Parameter var1, var2, dan sebagainya adalah nilai-nilai variabel atau masuk ke fungsi. Para (dan yang) mendefinisikan awal dan akhir fungsi. Catatan: Fungsi tanpa parameter harus menyertakan tanda kurung () setelah nama fungsi. Catatan: Jangan lupa tentang pentingnya modal dalam JavaScript! Fungsi kata harus ditulis dalam huruf kecil, jika tidak terjadi kesalahan JavaScript! Juga ingat bahwa Anda harus memanggil fungsi dengan modal yang sama seperti dalam nama fungsi. JavaScript Function Example Example <html> <head> <script type="text/javascript"> function displaymessage() { alert("Hello World!"); } </script> </head> <body> <form> <input type="button" value="Click me!" onclick="displaymessage()" /> </form> </body> </html> Jika baris: alert ( "Hello world!!") Dalam contoh di atas tidak pernah meletakkan dalam fungsi, itu telah dilaksanakan segera setelah jalur ini dimuat. Sekarang, skrip ini tidak dilakukan sebelum pengguna hits tombol input. Fungsi displaymessage () akan dijalankan jika tombol input diklik. Anda akan belajar lebih banyak tentang aktivitas JavaScript di Acara JS bab. Pernyataan kembali Pernyataan return digunakan untuk menentukan nilai yang dikembalikan dari fungsi. Jadi, fungsi yang akan mengembalikan nilai harus menggunakan pernyataan kembali. Contoh di bawah ini mengembalikan produk dari dua bilangan (a dan b): Example <html> <head> <script type="text/javascript"> function product(a,b) { return a*b; } </script> </head> <body>

<script type="text/javascript"> document.write(product(4,3)); </script> </body> </html> Lifetime Variabel JavaScript Jika Anda mendeklarasikan sebuah variabel dalam sebuah fungsi, variabel hanya dapat diakses di dalam fungsi. Ketika Anda keluar dari fungsi, variabel ini hancur. Variabel ini disebut variabel lokal. Anda dapat memiliki variabel lokal dengan nama yang sama dalam fungsi yang berbeda, karena masing-masing hanya diakui oleh fungsi yang dinyatakan. Jika Anda mendeklarasikan sebuah variabel di luar fungsi, semua fungsi pada halaman Anda dapat mengaksesnya. Masa hidup variabel-variabel ini dimulai ketika mereka dinyatakan, dan berakhir saat halaman ditutup. 14. JavaScript For Loop Loop mengeksekusi blok kode nomor tertentu kali, atau saat kondisi tertentu adalah benar. JavaScript Loops Sering bila Anda menulis kode, Anda ingin blok kode yang sama untuk menjalankan berkali-kali berturut-turut. Alih-alih hampir sama menambahkan beberapa baris di script kita dapat menggunakan loop untuk melakukan tugas seperti ini. Dalam JavaScript, ada dua jenis loop yang berbeda: * Untuk - loop melalui blok kode nomor tertentu kali * Sementara - loop melalui suatu blok kode selama kondisi tertentu adalah benar The for Loop Untuk loop yang digunakan ketika Anda tahu sebelumnya berapa kali script harus dijalankan. Syntax for (var=startvalue;var<=endvalue;var=var+increment) { code to be executed } Contoh Contoh di bawah ini mendefinisikan sebuah loop yang dimulai dengan i = 0. Loop akan terus berjalan selama i adalah kurang dari, atau sama dengan 5. i akan bertambah 1 setiap kali loop berjalan. Catatan: Parameter kenaikan juga bisa negatif, dan <= dapat membandingkan pernyataan apapun. Example <html> <body> <script type="text/javascript">

var i=0; for (i=0;i<=5;i++) { document.write("The number is " + i); document.write("<br />"); } </script> </body> </html> The while loop Sementara loop akan dijelaskan dalam bab berikutnya. 15. JavaScript While Loop Loop mengeksekusi blok kode nomor tertentu kali, atau saat kondisi tertentu adalah benar. The while Loop Sementara loop loop melalui blok kode selama kondisi tertentu adalah benar. Syntax while (var<=endvalue) { code to be executed } Catatan: <= bisa membandingkan pernyataan apapun. Contoh Contoh di bawah ini mendefinisikan sebuah loop yang dimulai dengan i = 0. Loop akan terus berjalan selama i adalah kurang dari, atau sama dengan 5. i akan bertambah 1 setiap kali loop berjalan: Example <html> <body> <script type="text/javascript"> var i=0; while (i<=5) { document.write("The number is " + i); document.write("<br />"); i++; } </script> </body> </html> The do...while Loop The do ... sementara loop adalah varian dari loop sementara. Loop ini akan menjalankan blok kode SEKALI, dan kemudian akan mengulang loop selama kondisi tertentu adalah benar. Syntax

do { code to be executed } while (var<=endvalue); Contoh Contoh di bawah ini menggunakan do ... sementara loop. The lakukan ... sementara loop akan selalu dijalankan minimal sekali, bahkan jika kondisi ini palsu, karena pernyataan dijalankan sebelum kondisi diuji: Example <html> <body> <script type="text/javascript"> var i=0; do { document.write("The number is " + i); document.write("<br />"); i++; } while (i<=5); </script> </body> </html> 16. JavaScript Break and Continue Statements The break Statement Pernyataan break akan mematahkan loop dan terus mengeksekusi kode berikut setelah loop (jika ada). Example <html> <body> <script type="text/javascript"> var i=0; for (i=0;i<=10;i++) { if (i==3) { break; } document.write("The number is " + i); document.write("<br />"); } </script> </body> </html> The continue Statement Pernyataan yang terus akan mematahkan loop arus dan melanjutkan nilai berikutnya.

Example <html> <body> <script type="text/javascript"> var i=0 for (i=0;i<=10;i++) { if (i==3) { continue; } document.write("The number is " + i); document.write("<br />"); } </script> </body> </html> 17. JavaScript For...In Statement the for ... dalam pernyataan loop melalui elemen-elemen dari sebuah array atau melalui sifat-sifat suatu objek. Syntax for (variable in object) { code to be executed } Catatan: kode dalam tubuh untuk ... di loop dijalankan sekali untuk setiap elemen / properti. Catatan: Variabel argumen dapat berupa nama variabel, elemen array, atau sebuah properti dari suatu objek. Contoh Gunakan untuk ... dalam pernyataan untuk loop melalui array: Example <html> <body> <script type="text/javascript"> var x; var mycars = new Array(); mycars[0] = "Saab"; mycars[1] = "Volvo"; mycars[2] = "BMW"; for (x in mycars) { document.write(mycars[x] + "<br />"); } </script>

</body> </html> 18. JavaScript Events Dengan menggunakan JavaScript, kita memiliki kemampuan untuk membuat halaman web dinamis. Peristiwa adalah tindakan-tindakan yang dapat dideteksi oleh JavaScript. Setiap elemen pada halaman web memiliki peristiwa-peristiwa tertentu yang dapat memicu JavaScript. Sebagai contoh, kita dapat menggunakan event onClick elemen sebuah tombol untuk mengindikasikan bahwa fungsi akan berjalan ketika pengguna mengklik pada tombol. Kita mendefinisikan peristiwa dalam tag HTML. Contoh peristiwa: * A mouse klik * Sebuah halaman web atau gambar loading * Mousing atas hot spot pada halaman web * Memilih field input dalam bentuk HTML * Menyerahkan formulir HTML * A keystroke Catatan: Acara biasanya digunakan dalam kombinasi dengan fungsi, dan fungsi tidak akan dijalankan sebelum peristiwa terjadi! Untuk referensi yang lengkap tentang peristiwa-peristiwa diakui oleh JavaScript, pergi ke JavaScript lengkap kami onLoad and onUnload The onLoad dan peristiwa onUnload dipicu ketika user memasuki atau meninggalkan halaman. The aktivitas onLoad sering digunakan untuk memeriksa pengunjung jenis browser dan versi browser, dan beban yang tepat versi halaman web berdasarkan informasi. Baik peristiwa onUnload onLoad dan juga sering digunakan untuk menangani cookie yang harus di set ketika pengguna memasuki atau meninggalkan halaman. Sebagai contoh, Anda bisa memiliki popup menanyakan nama pengguna pada kedatangan pertamanya ke halaman Anda. Nama ini kemudian disimpan dalam cookie. Lain kali pengunjung tiba di halaman Anda, Anda bisa memiliki popup lain mengatakan sesuatu seperti: "Selamat datang John Doe!". onFocus, onBlur and onChange The onFocus, onChange peristiwa onBlur dan sering digunakan dalam kombinasi dengan kolom formulir validasi. Bawah ini adalah contoh bagaimana menggunakan event onChange. The checkEmail () fungsi akan dipanggil setiap kali pengguna mengubah isi dari lapangan: <input type="text" size="30" id="email" onchange="checkEmail()"> onSubmit Acara yang onSubmit digunakan untuk memvalidasi SEMUA kolom formulir sebelum mengirimkan itu.

Bawah ini adalah contoh bagaimana menggunakan event onSubmit. The checkForm () fungsi akan dipanggil saat pengguna mengklik tombol kirim dalam bentuk. Jika nilai-nilai lapangan tidak diterima, yang menyerahkan harus dibatalkan. Fungsi checkForm () mengembalikan entah benar atau salah. Mengembalikan nilai true jika formulir akan diserahkan, jika tidak menyerahkan akan dibatalkan: <form method="post" action="xxx.htm" onsubmit="return checkForm()"> onMouseOver and onMouseOut onMouseOver dan onmouseout sering digunakan untuk membuat "animasi" tombol. Di bawah ini adalah contoh dari suatu peristiwa onMouseOver. Kotak peringatan muncul ketika sebuah event onMouseOver terdeteksi: <a href="http://www.w3schools.com" onmouseover="alert('An event');return false"><img src="w3s.gif" alt="W3Schools" /></a> 19. JavaScript Try...Catch Statement Try ..catch statement memungkinkan Anda untuk menguji blok kode untuk kesalahan. JavaScript - Catching Errors Halaman Web saat browsing di internet, kita semua telah melihat kotak peringatan JavaScript memberitahu kita ada runtime error dan menanyakan "Apakah Anda ingin debug?". Pesan error seperti ini mungkin berguna bagi para pengembang tetapi tidak bagi pengguna. Ketika pengguna melihat kesalahan, mereka sering meninggalkan halaman Web. Bab ini akan mengajarkan anda bagaimana untuk menangkap dan menangani pesan error JavaScript, sehingga Anda tidak kehilangan audiens Anda The try...catch Statement The try...catch Statement memungkinkan Anda untuk menguji blok kode untuk kesalahan. Coba blok yang berisi kode untuk dijalankan, dan menangkap blok berisi kode untuk dijalankan jika kesalahan terjadi. Syntax try { //Run some code here } catch(err) { //Handle errors here } perhatikan bahwa try ... catch ditulis dalam huruf kecil. Menggunakan huruf besar akan menghasilkan kesalahan JavaScript! Contoh 1 Contoh di bawah ini seharusnya waspada "Welcome guest!" ketika tombol diklik. Namun, ada onMouseOver

kesalahan ketik pada pesan () function. alert () adalah salah eja sebagai adddlert (). Sebuah JavaScript kesalahan terjadi. Blok yang menangkap menangkap kesalahan dan menjalankan kode kustom untuk menanganinya. Kode menampilkan pesan kesalahan kustom menginformasikan kepada user apa yang terjadi: Example <html> <head> <script type="text/javascript"> var txt=""; function message() { try { adddlert("Welcome guest!"); } catch(err) { txt="There was an error on this page.\n\n"; txt+="Error description: " + err.description + "\n\n"; txt+="Click OK to continue.\n\n"; alert(txt); } } </script> </head> <body> <input type="button" value="View message" onclick="message()" /> </body> </html> Contoh 2 Contoh berikut menggunakan kotak konfirmasi untuk menampilkan pesan khusus memberitahu pengguna mereka dapat mengklik OK untuk melanjutkan melihat halaman atau klik Batal untuk pergi ke halaman muka. Jika metode mengkonfirmasi returns false, pengguna mengklik Batal, dan kode mengarahkan ulang pengguna. Jika metode mengkonfirmasi returns true, kode tidak apa-apa: Example <html> <head> <script type="text/javascript"> var txt=""; function message() { try { adddlert("Welcome guest!"); } catch(err) { txt="There was an error on this page.\n\n"; txt+="Click OK to continue viewing this page,\n";

txt+="or Cancel to return to the home page.\n\n"; if(!confirm(txt)) { document.location.href="http://www.w3schools.com/"; } } } </script> </head> <body> <input type="button" value="View message" onclick="message()" /> </body> </html> The throw Statement The throw statement can be used together with the try...catch statement, to create an exception for the error. Learn about the throw statement in the next chapter. 20. JavaScript Throw Statement The throw statement memungkinkan Anda untuk membuat pengecualian The Throw Statement Pernyataan lemparan memungkinkan Anda untuk membuat pengecualian. Jika Anda menggunakan pernyataan ini bersama-sama dengan mencoba ... menangkap pernyataan, Anda dapat mengontrol aliran program dan akurat menghasilkan pesan kesalahan. Syntax throw(exception) Pengecualian dapat berupa string, integer, Boolean atau suatu objek. Perhatikan bahwa membuang ditulis dalam huruf kecil. Menggunakan huruf besar akan menghasilkan kesalahan JavaScript! Contoh Contoh di bawah ini menentukan nilai dari sebuah variabel yang disebut x. Jika nilai x lebih tinggi dari 10, lebih rendah dari 0, atau tidak angka, kita akan melempar kesalahan. Kesalahan ini kemudian ditangkap oleh argumen dan menangkap pesan kesalahan yang tepat ditampilkan: Example <html> <body> <script type="text/javascript"> var x=prompt("Enter a number between 0 and 10:",""); try { if(x>10) { throw "Err1"; } else if(x<0)

{ throw "Err2"; } else if(isNaN(x)) { throw "Err3"; } } catch(er) { if(er=="Err1") { alert("Error! The value is too high"); } if(er=="Err2") { alert("Error! The value is too low"); } if(er=="Err3") { alert("Error! The value is not a number"); } } </script> </body> </html> 21. JavaScript Special Characters Dalam JavaScript anda dapat menambahkan karakter khusus ke teks string dengan menggunakan tanda garis miring terbalik. Insert Special Characters The backslash (\) digunakan untuk menyisipkan apostrof, baris baru, harga, dan karakter khusus lainnya menjadi string teks. Lihat kode JavaScript berikut: var txt="We are the so-called "Vikings" from the north."; document.write(txt); Dalam JavaScript, suatu string dimulai dan berhenti dengan baik tunggal atau tanda kutip ganda. Ini berarti bahwa string di atas akan cincang untuk: Kita adalah apa yang disebut Untuk mengatasi masalah ini, Anda harus menempatkan backslash (\) sebelum masing-masing dua kutipan dalam "Viking". Ini bergantian setiap ganda kutipan ke dalam sebuah string literal: var txt="We are the so-called \"Vikings\" from the north."; document.write(txt); JavaScript sekarang akan output string teks yang tepat: Kita adalah apa yang disebut "Viking" dari utara. Berikut adalah contoh lain: document.write ("You \& I are singing!");

Contoh di atas akan menghasilkan output sebagai berikut: You & I are singing! Tabel berikut berisi karakter khusus lainnya yang dapat ditambahkan ke sebuah string teks dengan tanda backslash: Code \' \" \& \\ \n \r \t \b \f Outputs single quote double quote ampersand backslash new line carriage return tab backspace form feed

22. JavaScript Guidelines Beberapa hal penting lainnya untuk mengetahui kapan scripting dengan JavaScript. JavaScript is Case Sensitive Sebuah fungsi bernama "myfunction" adalah tidak sama dengan "myFunction" dan sebuah variabel bernama "myVar" adalah tidak sama dengan "myvar". JavaScript kasus sensitif - karena itu melihat dari dekat kapitalisasi Anda ketika Anda membuat atau panggilan variabel, objek dan fungsi. White Space JavaScript mengabaikan spasi tambahan. Anda dapat menambahkan spasi ke skrip untuk membuatnya lebih mudah dibaca. Baris berikut adalah sama: name="Hege"; name = "Hege"; Break up a Code Line Anda dapat mematahkan sebuah baris kode dalam string teks dengan garis miring terbalik. Contoh di bawah ini akan ditampilkan dengan benar: document.write("Hello \ World!"); Namun, Anda tidak bisa memecahkan sebuah baris kode seperti ini: document.write \ ("Hello World!"); 23. JavaScript Objects Introduction JavaScript adalah sebuah Object Oriented Programming (OOP) bahasa. Sebuah bahasa OOP memungkinkan Anda untuk menentukan benda Anda sendiri dan membuat

sendiri jenis variabel. Object Oriented Programming JavaScript adalah sebuah Object Oriented Programming (OOP) bahasa. Sebuah bahasa OOP memungkinkan Anda untuk menentukan benda Anda sendiri dan membuat sendiri jenis variabel. Namun, menciptakan benda Anda sendiri akan dijelaskan kemudian, di bagian JavaScript Lanjutan. Kita akan mulai dengan melihat built-in JavaScript objek, dan bagaimana mereka digunakan. Halaman berikutnya akan menjelaskan setiap built-in JavaScript objek secara rinci. Perhatikan bahwa objek hanyalah sebuah jenis data khusus. Sebuah objek memiliki properti dan metode. Properties Properties adalah nilai-nilai yang berhubungan dengan objek. Pada contoh berikut ini kita menggunakan properti panjang dari objek String untuk mengembalikan jumlah karakter dalam sebuah string: <script type="text/javascript"> var txt="Hello World!"; document.write(txt.length); </script> Output dari kode di atas akan: 12 Methods Metode adalah tindakan yang dapat dilakukan pada objek. Pada contoh berikut ini kita menggunakan toUpperCase () method dari objek String untuk menampilkan teks dalam huruf besar: <script type="text/javascript"> var str="Hello world!"; document.write(str.toUpperCase()); </script> Output dari kode di atas akan: HELLO WORLD! 24. JavaScript String Object The String object digunakan untuk memanipulasi yang disimpan sepotong teks. Mengembalikan panjang string Cara menggunakan properti panjang untuk mencari panjang string. Style string Bagaimana gaya string. The indexOf () method

Cara menggunakan indexOf () method untuk mengembalikan posisi kejadian pertama dari nilai string tertentu dalam sebuah string. Pertandingan () method Cara menggunakan pertandingan () metode untuk mencari nilai string tertentu dalam sebuah string dan mengembalikan nilai string jika ditemukan Ganti karakter dalam string - menggantikannya () Cara menggunakan menggantikan () method untuk mengganti beberapa karakter dengan karakter lain dalam sebuah string. Complete String Object Reference Untuk referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan objek String, pergi ke lengkap kita referensi obyek String. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode! String object Objek String digunakan untuk memanipulasi yang disimpan sepotong teks. Contoh-contoh penggunaannya: Contoh berikut menggunakan properti panjang dari objek String untuk menemukan panjang string: var txt="Hello world!"; document.write(txt.length); Kode di atas akan menghasilkan output sebagai berikut: 12 Contoh berikut menggunakan toUpperCase () method dari objek String untuk mengkonversi string ke huruf besar: var txt="Hello world!"; document.write(txt.toUpperCase()); Kode di atas akan menghasilkan output sebagai berikut: HELLO WORLD! 25. JavaScript Date Object Date Object yang digunakan untuk bekerja dengan tanggal dan waktu. Kembali hari ini tanggal dan waktu Cara menggunakan Tanggal () method untuk mendapatkan tanggal hari ini. getTime () Gunakan getTime () untuk menghitung tahun sejak 1970. setFullYear () Bagaimana menggunakan setFullYear () untuk menetapkan tanggal tertentu.

toUTCString () Bagaimana menggunakan toUTCString () untuk mengubah tanggal hari ini (menurut UTC) ke string. getDay () Gunakan getDay () dan sebuah array untuk menulis hari kerja, dan bukan hanya sebuah nomor. Menampilkan jam Bagaimana menampilkan jam di halaman web Anda. Complete Date Object Reference Untuk referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan objek Tanggal, pergi ke Tanggal lengkap kita referensi obyek. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode! Create a Date Object Tanggal objek yang digunakan untuk bekerja dengan tanggal dan waktu. Kode berikut membuat objek disebut myDate Tanggal: var myDate=new Date() Catatan: Tanggal objek akan secara otomatis terus tanggal dan waktu sebagai nilai awal! Set Dates We can easily manipulate the date by using the methods available for the Date object. In the example below we set a Date object to a specific date (14th January 2010): var myDate=new Date(); myDate.setFullYear(2010,0,14); Dan dalam contoh berikut, kita menetapkan Tanggal benda menjadi 5 hari ke depan: var myDate=new Date(); myDate.setDate(myDate.getDate()+5); Catatan: Jika menambahkan lima hari untuk menggeser tanggal bulan atau tahun, perubahan ditangani secara otomatis oleh objek Tanggal sendiri! Compare Two Dates Tanggal objek juga digunakan untuk membandingkan dua tanggal. Contoh berikut membandingkan tanggal hari ini dengan 14 Januari 2010: var myDate=new Date(); myDate.setFullYear(2010,0,14);

var today = new Date(); if (myDate>today) { alert("Today is before 14th January 2010"); } else { alert("Today is after 14th January 2010"); } 26. JavaScript Array Object Array Object yang digunakan untuk menyimpan beberapa nilai dalam satu variabel. Buat sebuah array Buat sebuah array, memberikan nilai pada itu, dan menulis nilai-nilai ke output. Untuk ... Dalam Pernyataan Cara menggunakan untuk ... di pernyataan untuk loop melalui elemen-elemen array. Gabung dua array - concat () Cara menggunakan concat () method untuk bergabung dua array. Masukkan elemen array menjadi sebuah string - gabung () Cara menggunakan join () metode untuk memasukkan semua elemen array menjadi sebuah string. Literal array - sort () Cara menggunakan sort () method untuk mengurutkan array literal. Numeric array - sort () Cara menggunakan sort () method untuk mengurutkan array numerik. Complete Array Object Reference Untuk referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan Array objek, pergi ke Array lengkap kita referensi obyek. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode! What is an Array? Array adalah variabel khusus, yang dapat menyimpan lebih dari satu nilai, pada suatu waktu. Jika Anda memiliki daftar item (daftar nama-nama mobil, misalnya), menyimpan mobil di variabel tunggal bisa terlihat seperti ini cars1="Saab"; cars2="Volvo"; cars3="BMW"; Namun, bagaimana jika Anda ingin loop melalui mobil dan menemukan satu tertentu? Dan bagaimana jika kau tidak 3 mobil, tapi 300?

Solusi terbaik di sini adalah dengan menggunakan sebuah array! Sebuah array dapat menampung semua nilai variabel Anda di bawah satu nama. Dan Anda dapat mengakses nilai dengan mengacu pada nama array. Setiap elemen dalam array memiliki ID sendiri sehingga dapat dengan mudah diakses. Create an Array Kode berikut membuat sebuah objek Array disebut myCars: var myCars=new Array(); Ada dua cara untuk menambahkan nilai-nilai ke array (Anda dapat menambahkan sebanyak mungkin nilai-nilai yang Anda butuhkan untuk menetapkan sebagai banyak variabel yang Anda butuhkan) . 1: var myCars=new Array(); myCars[0]="Saab"; myCars[1]="Volvo"; myCars[2]="BMW"; Anda dapat pula mem-pass sebuah argumen integer untuk mengendalikan ukuran array: var myCars=new Array(3); myCars[0]="Saab"; myCars[1]="Volvo"; myCars[2]="BMW"; 2: var myCars=new Array("Saab","Volvo","BMW"); Catatan: Jika Anda menetapkan nomor atau benar / salah nilai-nilai dalam array maka jenis variabel akan numerik atau Boolean bukan string. Access an Array Anda dapat merujuk pada elemen tertentu dalam array dengan mengacu pada nama dari array dan nomor indeks. Angka indeks dimulai pada 0. Baris kode berikut: document.write(myCars[0]); akan menghasilkan output sebagai berikut: Saab Modify Values in an Array To modify a value in an existing array, just add a new value to the array with a specified index number: myCars[0]="Opel"; Now, the following code line:

document.write(myCars[0]); akan menghasilkan output sebagai berikut: Opel 27. JavaScript Boolean Object Objek yang Boolean digunakan untuk mengkonversi nilai non-Boolean ke sebuah nilai boolean (true atau false). Complete Boolean Object Reference atau referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan objek Boolean, pergi ke Boolean lengkap kita referensi obyek. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode! Create a Boolean Object Boolean objek yang mewakili dua nilai: "benar" atau "palsu". Kode berikut membuat objek Boolean disebut myBoolean: var myBoolean=new Boolean(); Catatan: Jika objek Boolean tidak memiliki nilai awal atau jika itu adalah 0, -0, null, "", false, undefined, atau NaN, objek diatur ke false. Kalau itu benar (bahkan dengan string "palsu")! Semua baris kode berikut membuat objek Boolean dengan nilai awal false: var myBoolean=new Boolean(); var myBoolean=new Boolean(0); var myBoolean=new Boolean(null); var myBoolean=new Boolean(""); var myBoolean=new Boolean(false); var myBoolean=new Boolean(NaN); Dan semua baris kode berikut membuat objek Boolean dengan nilai awal yang benar: var myBoolean=new Boolean(true); var myBoolean=new Boolean("true"); var myBoolean=new Boolean("false"); var myBoolean=new Boolean("Richard"); 28. JavaScript Math Object he Math object allows you to perform mathematical tasks. bulat () Bagaimana menggunakan bulat (). acak ()

Bagaimana menggunakan acak () untuk mengembalikan nomor acak antara 0 dan 1. max () Bagaimana menggunakan max () untuk mengembalikan nomor dengan nilai tertinggi dari dua nomor tertentu. min () Bagaimana menggunakan min () untuk mengembalikan nomor dengan nilai terendah dua nomor tertentu. Complete Math Object Reference Untuk referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan objek Math, pergi ke Math lengkap kita referensi obyek. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode! Math Object Math objek memungkinkan Anda untuk melakukan tugas-tugas matematika. Objek Math meliputi beberapa konstanta matematika dan metode. Syntax for using properties/methods of Math: var pi_value=Math.PI; var sqrt_value=Math.sqrt(16); Catatan: Math bukan konstruktor. Semua properti dan metode Matematika dapat disebut dengan menggunakan Matematika sebagai objek tanpa menciptakan itu. Mathematical Constants JavaScript menyediakan delapan matematis konstanta yang dapat diakses dari objek Math. Ini adalah: E, PI, akar kuadrat dari 2, akar kuadrat dari 1 / 2, log natural dari 2, log natural dari 10, dasar-2 log dari E, dan basis-10 log E. Anda mungkin referensi konstanta ini dari JavaScript seperti ini: Math.E Math.PI Math.SQRT2 Math.SQRT1_2 Math.LN2 Math.LN10 Math.LOG2E Math.LOG10E Mathematical Methods Selain konstanta matematika yang dapat diakses dari objek Math ada juga beberapa metode yang tersedia. Contoh berikut menggunakan bulat () method dari objek Math untuk melengkapi nomor ke integer terdekat:

document.write(Math.round(4.7)); Kode di atas akan menghasilkan output sebagai berikut: 5 Contoh berikut menggunakan acak () method dari objek Math untuk kembali nomor acak antara 0 dan 1: document.write(Math.random()); Kode di atas dapat menghasilkan output sebagai berikut: 0.54609912968258 Contoh berikut menggunakan lantai () dan random () metode dari objek Math untuk kembali nomor acak antara 0 dan 10: document.write(Math.floor(Math.random()*11)); Kode di atas dapat menghasilkan output sebagai berikut: 8 29. JavaScript RegExp Object The RegExp object is used to specify what to search for in a text What is RegExp Regexp, adalah singkatan dari kalimat biasa. Ketika Anda mencari di dalam teks, Anda dapat menggunakan pola untuk menggambarkan apa yang Anda cari. Regexp IS pola ini. Pola sederhana dapat menjadi satu karakter. Pola yang lebih rumit terdiri dari beberapa karakter, dan dapat digunakan untuk pengolahan, format memeriksa, substitusi dan banyak lagi. Anda dapat menentukan di mana dalam string untuk mencari, apa jenis karakter untuk mencari, dan banyak lagi. Defining RegExp The regexp objek yang digunakan untuk menyimpan pola pencarian. Kita mendefinisikan sebuah objek regexp dengan kata kunci yang baru. Baris kode berikut mendefinisikan sebuah objek regexp disebut patt1 dengan pola "e": var patt1=new RegExp("e"); Bila Anda menggunakan obyek regexp ini untuk mencari dalam sebuah string, Anda akan menemukan huruf "e" Methods of the RegExp Object The regexp Objek memiliki 3 metode: test (), exec (), dan kompilasi ().

test () Tes () metode pencarian string untuk nilai tertentu. Mengembalikan nilai true atau false Example var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free")); Karena ada "e" dalam string, output dari kode di atas akan: true exec() The exec () metode pencarian string untuk nilai tertentu. Mengembalikan teks yang ditemukan nilai. Jika tidak cocok yang ditemukan, maka kembali null Example 1 var patt1=new RegExp("e"); document.write(patt1.exec("The best things in life are free")); Karena ada "e" dalam string, output dari kode di atas akan: e Anda dapat menambahkan parameter kedua ke objek regexp, untuk menentukan pencarian Anda. Sebagai contoh, jika anda ingin mencari semua kejadian dari sebuah karakter, Anda dapat menggunakan "g" Parameter ( "global"). Untuk daftar lengkap tentang bagaimana memodifikasi pencarian Anda, kunjungi referensi obyek regexp lengkap. Bila menggunakan huruf "g" parameter, exec () method bekerja seperti ini: * Mencari terjadinya pertama "e", dan toko posisinya * Jika Anda menjalankan exec () lagi, hal itu dimulai pada posisi yang tersimpan, dan menemukan terjadinya berikutnya "e", dan toko posisinya Example 2 var patt1=new RegExp("e","g"); do { result=patt1.exec("The best things in life are free"); document.write(result); } while (result!=null) Karena ada enam "e" huruf dalam string, output dari kode di atas akan:. eeeeeenull

JavaScript RegExp Object « Previous Next Chapter » The RegExp object is used to specify what to search for in a text

What is RegExp RegExp, is short for regular expression. When you search in a text, you can use a pattern to describe what you are searching for. RegExp IS this pattern. A simple pattern can be a single character. A more complicated pattern consists of more characters, and can be used for parsing, format checking, substitution and more. You can specify where in the string to search, what type of characters to search for, and more. Defining RegExp The RegExp object is used to store the search pattern. We define a RegExp object with the new keyword. The following code line defines a RegExp object called patt1 with the pattern "e": var patt1=new RegExp("e"); When you use this RegExp object to search in a string, you will find the letter "e". Methods of the RegExp Object The RegExp Object has 3 methods: test(), exec(), and compile(). test() The test() method searches a string for a specified value. Returns true or false Example var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free")); Since there is an "e" in the string, the output of the code above will be: true Try it yourself exec() The exec() method searches a string for a specified value. Returns the text of the found value. If no match is found, it returns null Example 1 var patt1=new RegExp("e"); document.write(patt1.exec("The best things in life are free")); Since there is an "e" in the string, the output of the code above will be: e Try it yourself You can add a second parameter to the RegExp object, to specify your search. For example; if you want to find all occurrences of a character, you can use the "g" parameter ("global").

For a complete list of how to modify your search, visit our complete RegExp object reference. When using the "g" parameter, the exec() method works like this: * Finds the first occurence of "e", and stores its position * If you run exec() again, it starts at the stored position, and finds the next occurence of "e", and stores its position Example 2 var patt1=new RegExp("e","g"); do { result=patt1.exec("The best things in life are free"); document.write(result); } while (result!=null) Since there is six "e" letters in the string, the output of the code above will be: eeeeeenull Try it yourself compile() Kompilasi () Metode ini digunakan untuk mengubah regexp. kompilasi () dapat mengubah pola pencarian baik, dan menambahkan atau menghapus parameter kedua. Example var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free")); patt1.compile("d"); document.write(patt1.test("The best things in life are free")); Karena ada "e" dalam string, tetapi bukan "d", output dari kode di atas akan: truefalse Complete RegExp Object Reference Untuk referensi yang lengkap dari semua properti dan metode yang dapat digunakan dengan objek regexp, pergi ke regexp lengkap kita referensi obyek. Referensi berisi penjelasan singkat dan contoh-contoh penggunaannya untuk masing-masing properti dan metode termasuk objek string. 31. JavaScript Browser Detection Objek Navigator berisi informasi tentang browser pengunjung ...

Browser Detection Hampir semua hal dalam tutorial ini bekerja pada semua JavaScript-enabled browser. Namun, ada beberapa hal yang tidak berfungsi pada browser tertentu - terutama pada browser lama. Jadi, kadang-kadang dapat sangat berguna untuk mendeteksi browser pengunjung, dan kemudian menyajikan informasi yang sesuai. Cara terbaik untuk melakukannya adalah dengan membuat halaman web Anda cukup cerdas untuk melihat salah satu cara untuk beberapa browser dan cara lain untuk browser lainnya. Objek Navigator dapat digunakan untuk tujuan ini. Objek Navigator berisi informasi tentang nama browser pengunjung, versi, dan banyak lagi. Catatan Catatan: Tidak ada standar umum yang berlaku untuk objek navigator, tapi semua browser utama mendukungnya. The Navigator Object Objek Navigator berisi semua informasi tentang browser pengunjung. Kita akan melihat dua sifat objek Navigator: * AppName - memegang nama browser * AppVersion - berlaku, antara lain, versi browser Example <html> <body> <script type="text/javascript"> var browser=navigator.appName; var b_version=navigator.appVersion; var version=parseFloat(b_version); document.write("Browser name: "+ browser); document.write("<br />"); document.write("Browser version: "+ version); </script> </body> </html> Variabel "browser" pada contoh di atas memegang nama browser, yaitu "Netscape" atau "Microsoft Internet Explorer". The appVersion properti dalam contoh di atas mengembalikan sebuah string yang berisi informasi lebih dari sekadar nomor versi, tetapi untuk sekarang kita hanya tertarik pada nomer versi. Untuk menarik nomor versi dari string kita menggunakan fungsi bernama parseFloat (), yang menarik hal pertama yang terlihat seperti angka desimal dari string dan mengembalikannya. PENTING! Nomor versi SALAH di IE 5.0 atau nanti! Microsoft memulai appVersion string dengan nomor 4.0. di IE 5.0 dan IE 6.0! Mengapa mereka melakukan itu??? Namun, JavaScript sama di IE6, IE4 dan IE5, sehingga untuk kebanyakan skrip itu ok.

Contoh di bawah ini menampilkan peringatan yang berbeda, tergantung pada browser pengunjung: Example <html> <head> <script type="text/javascript"> function detectBrowser() { var browser=navigator.appName; var b_version=navigator.appVersion; var version=parseFloat(b_version); if ((browser=="Netscape"||browser=="Microsoft Internet Explorer") && (version>=4)) { alert("Your browser is good enough!"); } else { alert("It's time to upgrade your browser!"); } } </script> </head> <body onload="detectBrowser()"> </body> </html> 32. JavaScript Cookies Cookie sering digunakan untuk mengidentifikasi pengguna. What is a Cookie? Cookie adalah sebuah variabel yang disimpan pada komputer pengunjung. Setiap kali komputer yang sama meminta halaman dengan browser, ia akan mengirimkan cookie juga. Dengan JavaScript, Anda berdua dapat membuat dan mengambil nilai cookie. Contoh cookie: * Nama cookie - Untuk pertama kali pengunjung datang ke halaman web anda, dia harus mengisi dirinya / namanya. Nama ini kemudian disimpan dalam cookie. Lain kali pengunjung Anda tiba di halaman, dia bisa mendapatkan pesan selamat datang seperti "Selamat datang John Doe!" Nama ini diambil dari cookie yang disimpan * Password cookie - Untuk pertama kali pengunjung datang ke halaman web anda, dia harus mengisi password. Sandi ini kemudian disimpan dalam cookie. Lain kali pengunjung tiba di halaman Anda, maka sandi tersebut diambil dari cookie * Tanggal cookie - Untuk pertama kali pengunjung datang ke halaman web anda, tanggal hari ini yang disimpan dalam cookie. Lain kali pengunjung Anda tiba di halaman, dia bisa mendapatkan pesan seperti "kunjungan terakhir Anda adalah pada hari Selasa 11 Agustus 2005!" Tanggal diambil dari cookie yang disimpan Create and Store a Cookie Dalam contoh ini kita akan membuat sebuah cookie yang menyimpan nama pengunjung.

Pertama kali pengunjung datang ke halaman web, ia akan diminta untuk mengisi dalam dirinya / namanya. Nama ini kemudian disimpan dalam cookie. Waktu berikutnya pengunjung tiba di halaman yang sama, ia atau dia akan mendapatkan pesan selamat datang. Pertama, kita menciptakan sebuah fungsi yang menyimpan nama pengunjung dalam sebuah cookie variabel: function setCookie(c_name,value,expiredays) { var exdate=new Date(); exdate.setDate(exdate.getDate()+expiredays); document.cookie=c_name+ "=" +escape(value)+ ((expiredays==null) ? "" : ";expires="+exdate.toGMTString()); } Parameter dari fungsi di atas terus nama cookie, nilai cookie, dan jumlah hari sampai cookie itu kedaluwarsa. Pada fungsi di atas pertama kita mengubah jumlah hari untuk tanggal yang valid, maka kita menambahkan jumlah hari sampai cookie harus berakhir. Setelah itu kita simpan nama cookie, nilai cookie, dan tanggal kedaluwarsa di objek document.cookie. Kemudian, kita menciptakan fungsi lain yang memeriksa apakah cookie telah ditetapkan: function getCookie(c_name) { if (document.cookie.length>0) { c_start=document.cookie.indexOf(c_name + "="); if (c_start!=-1) { c_start=c_start + c_name.length+1; c_end=document.cookie.indexOf(";",c_start); if (c_end==-1) c_end=document.cookie.length; return unescape(document.cookie.substring(c_start,c_end)); } } return ""; } Fungsi pertama di atas akan memeriksa apakah ada cookie yang disimpan pada semua di objek document.cookie. Jika objek document.cookie memegang beberapa kue, kemudian periksa untuk melihat apakah kita cookie disimpan spesifik. Jika cookie kami ditemukan, maka mengembalikan nilai, jika tidak - kembali string kosong. Terakhir, kita membuat fungsi yang menampilkan pesan selamat datang jika ada cookie yang dibuat, dan jika cookie tidak diatur akan menampilkan kotak prompt, meminta nama user: function checkCookie() { username=getCookie('username'); if (username!=null && username!="") { alert('Welcome again '+username+'!'); } else

{ username=prompt('Please enter your name:',""); if (username!=null && username!="") { setCookie('username',username,365); } } } Semua bersama sekarang: Example <html> <head> <script type="text/javascript"> function getCookie(c_name) { if (document.cookie.length>0) { c_start=document.cookie.indexOf(c_name + "="); if (c_start!=-1) { c_start=c_start + c_name.length+1; c_end=document.cookie.indexOf(";",c_start); if (c_end==-1) c_end=document.cookie.length; return unescape(document.cookie.substring(c_start,c_end)); } } return ""; } function setCookie(c_name,value,expiredays) { var exdate=new Date(); exdate.setDate(exdate.getDate()+expiredays); document.cookie=c_name+ "=" +escape(value)+ ((expiredays==null) ? "" : ";expires="+exdate.toGMTString()); } function checkCookie() { username=getCookie('username'); if (username!=null && username!="") { alert('Welcome again '+username+'!'); } else { username=prompt('Please enter your name:',""); if (username!=null && username!="") { setCookie('username',username,365); } } } </script>

</head> <body onload="checkCookie()"> </body> </html> Contoh di atas menjalankan checkCookie () fungsi ketika halaman load. 33. JavaScript Form Validation JavaScript Form Validation JavaScript dapat digunakan untuk memvalidasi data dalam bentuk HTML sebelum mengirim dari konten ke server. Formulir data yang biasanya diperiksa oleh JavaScript dapat berupa: * Memiliki pengguna meninggalkan bidang kosong yang diperlukan? * Memiliki pengguna yang valid memasukkan alamat e-mail? * Memiliki pengguna memasukkan tanggal yang valid? * Memiliki pengguna memasukkan teks dalam bidang numerik? Required Fields Fungsi di bawah ini akan memeriksa apakah bidang yang diperlukan telah ditinggalkan kosong. Jika bidang yang dibutuhkan kosong, kotak peringatan peringatan pesan dan fungsi returns false. Jika nilai yang dimasukkan, fungsi mengembalikan nilai true (berarti bahwa data yang OK): function validate_required(field,alerttxt) { with (field) { if (value==null||value=="") { alert(alerttxt);return false; } else { return true; } } } Seluruh script, dengan bentuk HTML bisa terlihat seperti ini: <html> <head> <script type="text/javascript"> function validate_required(field,alerttxt) { with (field) { if (value==null||value=="") { alert(alerttxt);return false; }

else { return true; } } } function validate_form(thisform) { with (thisform) { if (validate_required(email,"Email must be filled out!")==false) {email.focus();return false;} } } </script> </head> <body> <form action="submit.htm" onsubmit="return validate_form(this)" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html> E-mail Validation Fungsi di bawah ini akan memeriksa apakah konten memiliki sintaks umum dari sebuah email. Ini berarti bahwa data input harus mengandung setidaknya satu simbol @ dan titik (.). Juga, tidak boleh @ karakter pertama dari alamat email, dan titik terakhir harus setidaknya satu karakter setelah tanda @: function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@"); dotpos=value.lastIndexOf("."); if (apos<1||dotpos-apos<2) {alert(alerttxt);return false;} else {return true;} } } Seluruh script, dengan bentuk HTML bisa terlihat seperti ini: <html> <head> <script type="text/javascript"> function validate_email(field,alerttxt) { with (field)

{ apos=value.indexOf("@"); dotpos=value.lastIndexOf("."); if (apos<1||dotpos-apos<2) {alert(alerttxt);return false;} else {return true;} } } function validate_form(thisform) { with (thisform) { if (validate_email(email,"Not a valid e-mail address!")==false) {email.focus();return false;} } } </script> </head> <body> <form action="submit.htm" onsubmit="return validate_form(this);" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html> 35. JavaScript Animation Dengan JavaScript kita dapat membuat gambar animasi. JavaScript Animasi Adalah mungkin untuk menggunakan JavaScript untuk membuat gambar animasi. Caranya adalah dengan membiarkan JavaScript perubahan antara gambar yang berbeda pada berbagai aktivitas. Pada contoh berikut ini kita akan menambahkan sebuah gambar yang harus bertindak sebagai tombol link pada halaman web. Kami kemudian akan menambahkan sebuah event onMouseOver dan event onmouseout yang akan menjalankan dua fungsi JavaScript yang akan mengubah antara gambar. The HTML Code Kode HTML terlihat seperti ini: <a href="http://www.w3schools.com" target="_blank"> <img border="0" alt="Visit W3Schools!" src="b_pink.gif" id="b1" onmouseOver="mouseOver()" onmouseOut="mouseOut()" /></a> Perhatikan bahwa kita telah memberikan gambar sebuah id, untuk memungkinkan JavaScript untuk mengatasinya nanti.

Acara yang onMouseOver menginformasikan kepada browser bahwa sekali mouse berguling gambar, browser harus melaksanakan fungsi yang akan menggantikan gambar dengan gambar lain. Acara yang onmouseout menginformasikan kepada browser bahwa setelah mouse berguling menjauh dari citra, fungsi JavaScript yang lain harus dieksekusi. Fungsi ini akan memasukkan gambar asli lagi. The JavaScript Code Perubahan antara gambar dilakukan dengan JavaScript berikut: <script type="text/javascript"> function mouseOver() { document.getElementById("b1").src ="b_blue.gif"; } function mouseOut() { document.getElementById("b1").src ="b_pink.gif"; } </script> Gunaka mouse di atas fungsi () menyebabkan image bergeser ke "b_blue.gif". Fungsi mouseOut () menyebabkan image bergeser ke "b_pink.gif". The Entire Code Example <html> <head> <script type="text/javascript"> function mouseOver() { document.getElementById("b1").src ="b_blue.gif"; } function mouseOut() { document.getElementById("b1").src ="b_pink.gif"; } </script> </head> <body> <a href="http://www.w3schools.com" target="_blank"> <img border="0" alt="Visit W3Schools!" src="b_pink.gif" id="b1" onmouseover="mouseOver()" onmouseout="mouseOut()" /></a> </body> </html> 36. JavaScript Image Maps Gambar-gambar peta dengan daerah diklik. HTML Image Maps

Dari HTML tutorial kita telah mengetahui bahwa gambar-gambar peta dengan daerah diklik. Biasanya, setiap daerah memiliki hyperlink terkait. Mengklik pada salah satu daerah membawa Anda ke link terkait. Lihat foto HTML sederhana kita-peta. Adding some JavaScript Kita dapat menambahkan event (yang dapat memanggil JavaScript) ke <area> tag di dalam peta gambar. <area> Tag yang mendukung onClick, onDblClick, onMouseDown, onMouseUp, onMouseOver, onMouseMove, onmouseout, onKeyPress, onKeyDown, onKeyUp, onFocus, dan onBlur peristiwa. Berikut foto HTML-peta contoh, dengan beberapa JavaScript ditambahkan: Example <html> <head> <script type="text/javascript"> function writeText(txt) { document.getElementById("desc").innerHTML=txt; } </script> </head> <body> <img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" /> <map name="planetmap"> <area shape ="rect" coords ="0,0,82,126" onMouseOver="writeText('The Sun and the gas giant planets like Jupiter are by far the largest objects in our Solar System.')" href ="sun.htm" target ="_blank" alt="Sun" /> <area shape ="circle" coords ="90,58,3" onMouseOver="writeText('The planet Mercury is very difficult to study from the Earth because it is always so close to the Sun.')" href ="mercur.htm" target ="_blank" alt="Mercury" /> <area shape ="circle" coords ="124,58,8" onMouseOver="writeText('Until the 1960s, Venus was often considered a twin sister to the Earth because Venus is the nearest planet to us, and because the two planets seem to share many characteristics.')" href ="venus.htm" target ="_blank" alt="Venus" /> </map> <p id="desc"></p> </body> </html> 37. JavaScript Timing Events JavaScript dapat dieksekusi dalam waktu-interval.

Ini disebut waktu peristiwa. JavaScript Timing Events Dengan JavaScript, adalah mungkin untuk menjalankan beberapa kode setelah interval waktu tertentu. Ini disebut waktu peristiwa. Ini sangat mudah ke waktu peristiwa dalam JavaScript. Dua metode utama yang digunakan adalah: * SetTimeout () - mengeksekusi kode beberapa waktu di masa depan * ClearTimeout () - membatalkan setTimeout () Catatan: setTimeout () dan clearTimeout () adalah metode baik DOM HTML objek Window. The setTimeout() Method syntax var t=setTimeout("javascript statement",milliseconds); The setTimeout () method mengembalikan nilai - Dalam pernyataan di atas, nilai yang disimpan dalam variabel yang disebut t. Jika Anda ingin membatalkan setTimeout (), Anda dapat merujuk ke sana menggunakan nama variabel. Parameter pertama dari setTimeout () adalah sebuah string yang berisi pernyataan JavaScript. Pernyataan ini bisa menjadi pernyataan seperti "alert ('5 detik! ')" Atau panggilan ke salah satu fungsi, seperti "alertMsg ()". Parameter kedua menunjukkan jumlah milidetik dari sekarang Anda ingin mengeksekusi parameter pertama. Catatan: Terdapat 1000 milidetik dalam satu detik. Contoh Ketika tombol diklik pada contoh di bawah ini, sebuah kotak peringatan akan ditampilkan setelah 5 detik. Example <html> <head> <script type="text/javascript"> function timedMsg() { var t=setTimeout("alert('5 seconds!')",5000); } </script> </head> <body> <form> <input type="button" value="Display timed alertbox!" onClick="timedMsg()" /> </form> </body> </html> Contoh - Infinite Loop

Untuk mendapatkan timer untuk bekerja di loop tak terbatas, kita harus menulis fungsi yang memanggil dirinya sendiri. Pada contoh di bawah ini, ketika sebuah tombol diklik, lapangan input akan mulai menghitung (selama-lamanya), dimulai dari 0. Perhatikan bahwa kita juga memiliki fungsi yang memeriksa apakah timer sudah berjalan, untuk menghindari pembuatan timer tambahan, jika tombol ditekan lebih dari sekali: Example <html> <head> <script type="text/javascript"> var c=0; var t; var timer_is_on=0; function timedCount() { document.getElementById('txt').value=c; c=c+1; t=setTimeout("timedCount()",1000); } function doTimer() { if (!timer_is_on) { timer_is_on=1; timedCount(); } } </script> </head> <body> <form> <input type="button" value="Start count!" onClick="doTimer()"> <input type="text" id="txt" /> </form> </body> </html> The clearTimeout() Method Syntax clearTimeout(setTimeout_variable) Contoh Contoh di bawah ini adalah sama dengan "Infinite Loop" contoh di atas. Satu-satunya perbedaan adalah bahwa kita sekarang menambahkan "Berhenti Count!" tombol yang menghentikan waktu: Example Example <html>

<head> <script type="text/javascript"> var c=0; var t; var timer_is_on=0; function timedCount() { document.getElementById('txt').value=c; c=c+1; t=setTimeout("timedCount()",1000); } function doTimer() { if (!timer_is_on) { timer_is_on=1; timedCount(); } } function stopCount() { clearTimeout(t); timer_is_on=0; } </script> </head> <body> <form> <input type="button" value="Start count!" onClick="doTimer()"> <input type="text" id="txt"> <input type="button" value="Stop count!" onClick="stopCount()"> </form> </body> </html> 39. JavaScript Create Your Own Objects JavaScript Objects Sebelumnya dalam tutorial ini kita telah melihat bahwa JavaScript memiliki beberapa built-in objek, seperti String, Tanggal, Array, dan banyak lagi. Selain built-in ini objek, Anda juga dapat membuat Anda sendiri. Sebuah objek hanya jenis data khusus, dengan koleksi properti dan metode. Mari kita mengilustrasikan dengan sebuah contoh: Seseorang adalah obyek. Properties adalah nilai-nilai yang berhubungan dengan objek. Orang-orang 'properti cantumkan nama, tinggi, berat badan, usia, warna kulit, warna mata, dan lain-lain Semua orang memiliki sifat ini, tetapi nilai-nilai dari properti-properti tersebut akan berbeda dari orang ke orang. Objek juga memiliki metode. Metode adalah tindakan yang dapat dilakukan pada objek. Orang-orang 'metode dapat makan (), tidur (), bekerja (), main (), dll Properties

The syntax for accessing a property of an object is: objName.propName Anda dapat menambahkan properti untuk sebuah benda dengan hanya memberi nilai. Asumsikan bahwa personObj sudah ada - Anda dapat memberikannya properti bernama nama depan, nama belakang, usia, dan eyecolor sebagai berikut: personObj.firstname="John"; personObj.lastname="Doe"; personObj.age=30; personObj.eyecolor="blue"; document.write(personObj.firstname); Kode di atas akan menghasilkan output sebagai berikut: John Metode Sebuah objek dapat juga berisi metode. Anda dapat memanggil metode dengan sintaks berikut: objName.methodName() Catatan: Parameter yang dibutuhkan untuk metode dapat ditularkan di antara tanda kurung. Untuk memanggil metode yang disebut tidur () untuk personObj: personObj.sleep(); Creating Your Own Objects Ada berbagai cara untuk membuat objek baru: 1. Buat contoh langsung dari sebuah objek Kode berikut membuat sebuah instance dari sebuah objek dan menambahkan empat properti untuk itu: personObj=new Object(); personObj.firstname="John"; personObj.lastname="Doe"; personObj.age=50; personObj.eyecolor="blue"; Menambahkan sebuah metode ke personObj juga sederhana. Kode berikut menambahkan metode yang disebut makan () ke personObj: personObj.eat=eat; 2. Buat sebuah template dari sebuah objek

Template mendefinisikan struktur suatu objek: function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; } Perhatikan bahwa template adalah sebuah fungsi. Di dalam fungsi yang Anda butuhkan untuk menetapkan hal-hal this.propertyName. Alasan untuk semua yang "ini" barang adalah bahwa Anda akan memiliki lebih dari satu orang pada satu waktu (yang orang yang Anda sedang berhadapan dengan harus jelas). Itulah yang "ini" adalah: turunan dari objek di tangan. Setelah Anda memiliki template, Anda dapat membuat instance baru dari objek, seperti ini: myFather=new person("John","Doe",50,"blue"); person("Sally","Rally",48,"green"); myMother=new

Anda juga dapat menambahkan beberapa metode untuk orang objek. Hal ini juga dilakukan di dalam template: function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; this.newlastname=newlastname; } Perhatikan bahwa fungsi metode hanya melekat pada objek. Kemudian kita harus menulis newlastname () function: function newlastname(new_lastname) { this.lastname=new_lastname; } The newlastname () fungsi orang tersebut mendefinisikan nama belakang baru dan memberikan itu kepada orang. JavaScript orang tahu yang sedang Anda bicarakan dengan menggunakan "ini.". Jadi, sekarang Anda dapat menulis: myMother.newlastname ( "Doe"). 39. You Have Learned JavaScript, Now What? Ringkasan JavaScript Tutorial ini mengajarkan anda bagaimana menambahkan JavaScript untuk halaman HTML Anda, untuk membuat situs web anda lebih dinamis dan interaktif. Anda telah belajar bagaimana untuk membuat tanggapan atas peristiwa, memvalidasi bentuk dan bagaimana membuat skrip yang berbeda berjalan dalam menanggapi skenario yang berbeda. Anda juga telah belajar bagaimana untuk membuat dan menggunakan objek, dan bagaimana

menggunakan JavaScript built-in obyek. Untuk informasi lebih lanjut tentang JavaScript, silahkan lihat JavaScript contoh dan referensi JavaScript. Now You Know JavaScript, What's Next? Langkah selanjutnya adalah belajar tentang DOM HTML dan DHTML. Jika Anda ingin belajar tentang server-side scripting, langkah berikutnya adalah untuk belajar ASP. HTML DOM HTML DOM mendefinisikan sebuah cara standar untuk mengakses dan memanipulasi dokumen HTML. HTML DOM adalah platform dan bahasa yang independen dan dapat digunakan oleh bahasa pemrograman seperti Java, JavaScript, dan VBScript. Jika Anda ingin mempelajari lebih lanjut tentang DOM, silahkan kunjungi tutorial HTML DOM. DHTML DHTML merupakan kombinasi dari HTML, CSS, dan JavaScript. DHTML digunakan untuk membuat dinamis dan interaktif situs Web. W3C pernah berkata: "Dynamic HTML adalah istilah yang digunakan oleh beberapa vendor untuk menggambarkan kombinasi dari HTML, style sheet dan skrip yang memungkinkan dokumen agar animasi." Jika Anda ingin belajar lebih banyak tentang DHTML, silahkan kunjungi tutorial DHTML. ASP Sementara skrip dalam file HTML dijalankan pada client (di browser), script dalam file ASP dijalankan di server. Dengan ASP secara dinamis, Anda dapat mengedit, merubah atau menambahkan konten halaman Web, menanggapi data yang diajukan dari form HTML, akses data atau database dan mengembalikan hasil ke browser, menyesuaikan halaman Web untuk membuatnya lebih bermanfaat untuk pengguna individual . Karena file ASP dikembalikan sebagai HTML, mereka dapat dilihat pada browser. Jika Anda ingin mempelajari lebih lanjut tentang ASP, silahkan kunjungi tutorial ASP. W3Schools 'Online Certification Program Solusi sempurna untuk profesional yang membutuhkan untuk menyeimbangkan kerja, keluarga, dan pembinaan karier. Lebih dari 4.000 sertifikat yang telah diterbitkan! Sertifikat dokumen HTML pengetahuan Anda tentang HTML, XHTML, dan CSS.

Dokumen Sertifikat JavaScript pengetahuan Anda tentang JavaScript dan HTML DOM. Dokumen Sertifikat XML pengetahuan Anda tentang XML, XML DOM dan XSLT. Dokumen Sertifikat ASP pengetahuan Anda tentang ASP, SQL, dan ADO. Dokumen Sertifikat PHP pengetahuan Anda tentang PHP dan SQL (MySQL). 40. JavaScript Examples Basic JavaScript Examples Menulis teks dengan JavaScript Menulis tag HTML dengan JavaScript JavaScript dalam bagian body JavaScript di bagian kepala JavaScript eksternal JavaScript Statements, Comments and Blocks Pernyataan JavaScript. JavaScript blok. Satu baris komentar. Beberapa baris komentar. Satu baris komentar untuk mencegah eksekusi. Beberapa baris komentar untuk mencegah eksekusi. JavaScript Variables Mendeklarasikan variabel, menetapkan nilai, dan menampilkan itu JavaScript Conditional If ... Else Jika pernyataan Jika ... lain pernyataan Link acak Pernyataan Switch JavaScript Popup Boxes Alert box Alert kotak dengan jeda baris Kotak Konfirmasi Pembisik JavaScript Functions Memanggil fungsi Fungsi dengan argumen Fungsi dengan argumen 2 Fungsi yang mengembalikan nilai Fungsi dengan argumen, yang mengembalikan sebuah nilai JavaScript Loops

Untuk loop Looping melalui header HTML Sementara loop Do While loop Break loop Istirahat dan melanjutkan loop Gunakan untuk ... di pernyataan untuk loop melalui elemen-elemen array JavaScript Error Handling ... Yang mencoba menangkap pernyataan ... Yang mencoba menangkap pernyataan dengan sebuah kotak konfirmasi The onError event Advanced JavaScript Examples Mendeteksi browser pengunjung dan versi browser Lebih lanjut tentang browser pengunjung Semua rincian tentang browser pengunjung Waspada pengguna, tergantung pada browser Buat kue welcome Tombol animasi Gambar peta dengan menambahkan JavaScript Sederhana waktu Lain waktu sederhana Waktu peristiwa dalam loop tak terbatas Waktu peristiwa dalam loop tak terbatas - dengan tombol Stop Sebuah jam dibuat dengan waktu acara Buat contoh langsung dari sebuah objek Buat template untuk sebuah objek 41. JavaScript Objects Examples Contoh menggunakan built-in JavaScript objek. String Object Mengembalikan panjang string Style string Mengembalikan posisi kejadian pertama sebuah teks dalam sebuah string - indexOf () Mencari teks di dalam string dan mengembalikan teks jika ditemukan - match () Ganti karakter dalam string - menggantikannya () Lebih String contoh objek di referensi JavaScript. Date Object Gunakan Tanggal () untuk kembali hari ini tanggal dan waktu Gunakan getTime () untuk menghitung tahun sejak 1970 Gunakan setFullYear () untuk menetapkan tanggal tertentu Gunakan toUTCString () untuk mengubah tanggal hari ini (menurut UTC) ke string Gunakan getDay () dan sebuah array untuk menulis hari kerja, dan bukan hanya sejumlah Menampilkan jam

Lebih Tanggal objek contoh di referensi JavaScript. Array Object Buat sebuah array Gunakan untuk ... di pernyataan untuk loop melalui elemen-elemen array Gabung dua array - concat () Masukkan elemen array menjadi sebuah string - gabung () Literal array - sort () Numeric array - sort () Lebih Array contoh objek di referensi JavaScript. Boolean Object Periksa nilai Boolean Lebih objek Boolean contoh di referensi JavaScript. Math Object Gunakan bulat () untuk mengumpulkan sejumlah Gunakan acak () untuk mengembalikan nomor acak antara 0 dan 1 Gunakan max () untuk mengembalikan nomor dengan nilai tertinggi dari dua nomor tertentu Menggunakan min () untuk mengembalikan nomor dengan nilai terendah dari dua nomor tertentu Convert Celsius ke Fahrenheit Objek Matematika lagi contoh-contoh di referensi JavaScript. 42. JavaScript HTML DOM Examples Contoh menggunakan JavaScript untuk mengakses dan memanipulasi objek HTML DOM. Anchor Object Ubah teks, URL, dan atribut target dari link Menggunakan fokus () dan kabur () Tambahkan Accesskey ke link Document Object Menulis teks ke output Menulis teks dengan format untuk output Kembali judul sebuah dokumen Mengembalikan dokumen URL Kembali pengarah dokumen Mengembalikan nama domain server dokumen Gunakan getElementById () Gunakan getElementsByName () Buka dokumen baru, tentukan tipe MIME dan menambahkan beberapa teks Mengembalikan jumlah jangkar dalam dokumen Mengembalikan innerHTML jangkar pertama dalam sebuah dokumen Menghitung jumlah bentuk-bentuk dalam dokumen Mengakses item dalam koleksi Menghitung jumlah gambar dalam sebuah dokumen

Event Object Which mouse button was clicked? What is the keycode of the key pressed? What are the coordinates of the cursor? What are the coordinates of the cursor, relative to the screen? Was the shift key pressed? Which element was clicked? Which event type occurred? Form and Form Input Objects Melihat dan mengubah URL tindakan bentuk Melihat metode yang akan digunakan bila mengirim data formulir Waspada id, jenis, dan nilai dari sebuah objek Button menonaktifkan tombol + Periksa dan hapus centang kotak centang Kotak centang dalam bentuk Checkbox - Jika pengguna mengklik pada kotak centang, isi kolom teks dikonversi ke huruf besar. Radio button Reset bentuk Kirim formulir Validasi Form Tetapkan fokus ke field input ketika halaman load Pilih isi sebuah field input Daftar dropdown dalam bentuk Daftar dropdown lain Sebuah menu dropdown Langsung ke lapangan berikutnya ketika MaxLength lapangan saat ini sudah tercapai Tambahkan accessKeys untuk membentuk bidang Frame, Frameset, and IFrame Objects Resizable dan tidak resizable frame Bingkai dengan dan tanpa scrollbars Mengubah sumber / URL dari dua bingkai Keluar dari bingkai Update dua iframes Image Object Mengubah tinggi dan lebar dari suatu gambar Ubah src dari suatu gambar Location Object Kirim klien ke lokasi yang baru / URL Reload halaman Keluar dari bingkai Jangkar array - Contoh ini membuka dua jendela. Jendela pertama berisi empat tombol dan jendela kedua mendefinisikan empat jangkar 0-3. Ketika tombol diklik pada jendela pertama, yang onclick event handler pergi ke jangkar yang ditentukan dalam jendela kedua.

Navigator Object Kirim klien ke lokasi yang baru / URL Reload halaman Keluar dari bingkai Jangkar array - Contoh ini membuka dua jendela. Jendela pertama berisi empat tombol dan jendela kedua mendefinisikan empat jangkar 0-3. Ketika tombol diklik pada jendela pertama, yang onclick event handler pergi ke jangkar yang ditentukan dalam jendela kedua. Option and Select Objects Menonaktifkan dan mengaktifkan dropdown list Dapatkan id dari formulir yang berisi daftar dropdown Dapatkan jumlah pilihan dalam dropdown list Mengubah daftar dropdown ke daftar multiline Memilih beberapa pilihan dalam daftar dropdown Alert opsi yang dipilih dalam sebuah daftar dropdown Alert indeks opsi yang dipilih dalam sebuah daftar dropdown Mengubah teks pilihan yang dipilih Hapus pilihan dari daftar dropdown Screen Object Mendeteksi rincian tentang klien layar Table, TableHeader, TableRow, TableData Objects Mengubah lebar tabel perbatasan Ubah cellpadding dan cellspacing dari meja Tentukan frame dari sebuah tabel Tentukan aturan untuk tabel InnerHTML dari deretan InnerHTML sel Buat keterangan untuk meja Hapus baris dalam tabel Tambahkan baris ke sebuah meja Sel Tambahkan ke sebuah baris tabel Align isi sel dalam baris tabel Align vertikal isi sel dalam baris tabel Align isi sel dalam satu sel Align vertikal isi sel dalam satu sel Mengubah isi sebuah sel tabel Ubah colspan dari sebuah baris tabel Window Object Menampilkan kotak peringatan Alert kotak dengan garis-break Menampilkan kotak konfirmasi Menampilkan kotak prompt Buka jendela baru ketika mengklik tombol Buka jendela baru dan mengontrol tampilan Buka beberapa jendela dengan satu klik Kirim klien ke lokasi yang baru / URL Reload halaman

Menulis beberapa teks dalam bar status jendela Cetak halaman Keluar dari bingkai Resize jendela Ubah ukuran jendela ke ukuran tertentu Gulir jendela Gulir jendela ke posisi tertentu Sederhana waktu Lain waktu sederhana Waktu peristiwa dalam loop tak terbatas Waktu peristiwa dalam loop tak terbatas - dengan tombol Stop Sebuah jam dibuat dengan waktu acara Buat pop-up

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->