Kamis, 02 November 2017

Atribut Event, ID, Program Input Output dan Function



Assalamualaikum

Kembali lagi dengan saya :D setelah sekian lama banyak kesibukan, hehehe. di sini saya akan membagikan ilmu tentang :

Atribut Event dan Id HTML

Atribut event merupakan HTML atribut yang berfungsi untuk menjalan kan perintah Script (JavaScript) yang secara umum dapat di gunakan pada semua element HTML.

Event merupakan peristiwa yang terjadi dalam HTML baik tanpa atau setelah ada interaksi user seperti menjalankan Script ketika loading atau dengan mengklik tombol Button pada element HTML <button> dan lain-lain.



Di script diatas menggunakan event onclick. Onclik merupakan intruksi untuk menjalankan script ketika sebuah elemen di klik.

ID
ID ini merupakan selector untuk menentukan bagian yang hanya ada pada satu halaman. Jadi sector ID ini tidak bisa di panggil lebih dari satu. Jika ada 2 maka hanya bekerja pada satu halaman saja. Selector ini juga bisa untuk me link pada satu halaman.
Contoh:

Function dan Input Output

Function

function namafungsi(parameter)
{
Beberapa code untuk dijalankan
}

Fungsi adalah suatu blok kode yang dijalankan ketika ada script yang memanggil fungsi tersebut. Fungsi merupakan bagian subprogram yang melaksanakan suatu tugas tertentu ketika diperlukan. Fungsi ini dapat dipanggil dengan cara menuliskan nama fungsinya saja, dan disertai dengan parameter apabila ada. Jadi parameter dalam suatu fungsi bersifat opsional.

function namafungsi(parameter)
{
Beberapa code untuk dijalankan
}
<html>
<head>
</head>
<body>
<script language="JavaScript" type="text/javascript">
function diskon(hargaAwal)
{
var diskon;
diskon = 0.5* hargaAwal;
hargaDiskon = hargaAwal -diskon;
return hargaDiskon;
}
var harga = prompt("Masukkan harga mula-mula (Rp) : ");
document.write("Harga stlh diskon 50%: Rp. " + diskon(harga));
</script>
</body>
</html>

Input Output

Bagaimana cara menampilkan output dan menerima input pada javascript. Pada umumnya, javascript bisa menerima semua inputan dari berbagai elemen form HTML. Pada bagian head kita menyisipkan sebuah script untuk memanggil function.

Untuk menampilka hasil Output menggunkam tag penampung hasil program javascript, kita harus membuat tag HTML misal <div> yang memiliki id.
Kemudian dalam program javascript kita menggunakan fungsi document.getElementById. Kemudian untuk memasukkan hasil output javascript ke dalam tag HTML menggunakan fungsi innerHTML = output.



Hasil :


Terimakasih... semoga bermanfaat ~~

Wassalamualaikum

Rabu, 13 September 2017

Bahasa Program Javascript (Operator Aritmatika)

Assalamualaikum



Hai... kembali lagi, kali ini saya ingin memberikan sedikit ilmu tentang operator aritmatika dengan menggunakan bahasa program Javascript. Operator aritmatika ini digunakan untuk melakukan operasi arimatika antara variabel atau nilai. Tabel berikut ini akan menjelaskan tentang operator aritmatika :


Kali ini saya akan menjelaskan tentang cara bagaimana menggunakan operator aritmatika penjumlahan,pengurangan,perkalian,dan pembagian. Sebelum kita itu kita harus membuat struktur HTML dan CSS yang sudah kita pelajari kemarin. Setelah itu ketik seperti di bawah ini :
<body>
                                                <div class="tengah">
                                               
                                                                <h3>PROGRAM ARITMATIKA</H3>
                                                                <div>
                                                                                <label> Bilangan 1</label>
                                                                                <input type="text" id="txtBil1"/>
                                                                </div>
                                                                <div>
                                                                                <label> Bilangan 2</label>
                                                                                <input type="text" id="txtBil2"/>
                                                                </div>
                                                                <div>
                                                                                <label> Hasil</label>
                                                                                <label syle="width:175px;font-style:bold;" id="lblHasil">Hasil</label>
                                                                </div>  
                                                                <div>
                                                                                <input type="button" id="btnJumlah" value="Penjumlahan"
                                                                                                onclick="Jumlah()"/>
                                                                                <input type="button" id="btnKurang" value="Pengurangan"
                                                                                                onclick="Kurang()"/>
                                                                                <input type="button" id="btnKali" value="Perkalian"
                                                                                                onclick="Kali()"/>
                                                                                <input type="button" id="btnBagi" value="Pembagian"
                                                                                                onclick="Bagi()"/>
                                                                </div>
                                                                                               
                                                </div>
                                               
                                <script>
                                                function Jumlah()
                                                {
                                                                var bil1 = document.getElementById("txtBil1").value;
                                                                var bil2 = document.getElementById("txtBil2").value;
                                                               
                                                                var Hasil = parseInt(bil1) + parseInt(bil2);
                                                               
                                                                document.getElementById("lblHasil").innerHTML = Hasil;
                                                }
                                </script>
                                <script>
                                                function Kurang ()
                                                {
                                                                var bil1 = document.getElementById("txtBil1").value;
                                                                var bil2 = document.getElementById("txtBil2").value;
                                                               
                                                                var Hasil = parseInt(bil1) - parseInt(bil2);
                                                               
                                                                document.getElementById("lblHasil").innerHTML = Hasil;
                                                               
                                                }
                                </script>             
                                <script>
                                                function Kali ()
                                                {
                                                                var bil1 = document.getElementById("txtBil1").value;
                                                                var bil2 = document.getElementById("txtBil2").value;
                                                               
                                                                var Hasil = parseInt(bil1) * parseInt(bil2);
                                                               
                                                                document.getElementById("lblHasil").innerHTML = Hasil;
                                                }             
                                </script>
                                                <script>
                                                function Bagi ()
                                                {
                                                                var bil1 = document.getElementById("txtBil1").value;
                                                                var bil2 = document.getElementById("txtBil2").value;
                                                               
                                                                var Hasil = parseInt(bil1) / parseInt(bil2);
                                                               
                                                                document.getElementById("lblHasil").innerHTML = Hasil;
                                                }             
                                </script>
                </body>                             


Disini saya mau menjelaskan tentang ParseInt itu adalah sebuah fungsi yang memungkinkan merubah satu variabel yang dilewatkan dengan parameter tertentu(bisa dalam bentuk string ataupun dalam bentuk bilangan dalam basis data yang disebutkan di parameter kedua) menjadi bilangan bulat.
Setelah mengetik koding di atas langsung saja Run dan akan tampil seperti ini:



Sekian dulu ya guys semoga bermanfaat, sampai jumpa di blog saya selanjutnya.. selamat mencoba... terimakasih...

Wassalamualaikum

Senin, 28 Agustus 2017

Bahasa Pemrograman JavaScript





Assalamualaikum





Aloha.... kali ini saya akan membagikan informasi pengetahuan tentang bahasa pemrograman. Dan kali ini saya akan menjelaskan tentang JavaScript (JS). Javascript adalah bahasa pemrograman yang digunakan untuk HTML dan WEB, untuk Server, PC, Laptop, tablet dan lebih banyak lagi. Kode pemrograman javascript dapat disisipkan kedalam halaman HTML. Pada awalnya, JavaScript mulai diperkenalkan di browser Netscape Navigator 2. Namun waktu itu namanya bukan JavaScript, namun LiveScript. Mengingat pada waktu itu teknologi Java sedang panas-panasnya atau sedang tren, maka pihak Netscape memutuskan untuk mengganti namanya menjadi JavaScript, yang sepertinya nama tersebut lebih marketible dibandingkan LiveScript.

JavaScript merupakan bahasa pemrograman tingkat tinggi dan dinamis, juga bahasa pemrograman yang popular di internet dan dapat bekerja di sebagian besar penjelajah web popular seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera.


Sebelum saya mulai saya ingin berterimakasih kepada dosen saya yang telah mengajarkan bahasa Javascript ini. Oke kalau begitu kita mulai




















Nah disini saya mau jelasin itu ada CSS. CSS itu adalah singkatan dari Cascaading Style Sheets. Berisi rangkaian instruksi yang menentukan bagaimana suatu text akan tampil di halaman web. Perancangan desain dapat di lakukan dengan mendefinisikan fonts (huruf), colors (warna), margins (ukuran), latar belakang (background), ukuran font (font size), dan lain-lain. Elemen-elemen seperti colors (warna), fonts (huruf),sizes (ukuran), dan spacing (jarak) disebut juga “styles”.


CSS yang akan dijalankan harus diletakkan diantara <style> dan </style> juga dengan tanda {}. Sedangkan bahasa Javascript ,Script yang akan dijalankan harus diletakkan diantara <script> dan </script>. Tag <script> memiliki beberapa atribut, namun yang terpenting adalah atribut language dan type.


Saya disini mau menjelaskan tentang isi javascript pertamana fungsi (function) adalah suatu blok kode yang dijalankan ketika ada script yang memanggil fungsi tersebut. Fungsi merupakan bagian subprogram yang melaksanakan suatu tugas tertentu ketika diperlukan. Fungsi ini dapat dipanggil dengan cara menuliskan nama fungsinya saja, dan disertai dengan parameter apabila ada.


Kedua, Deklarasi Variabel, dalam javascript, setiap kali akan menggunakan variabel, langkah pertama yang harus dilakukan adalah mendeklarasikan keberadaan nama variabel. Hal ini perlu dilakukan karena dengan adanya deklarasi nama variabel, computer akan menyediakan beberapa bagian memori untuk menyimpan nilai pada nama variabel tersebut. Untuk mendeklarasikan variabel digunakan kata var. Dalam mendeklarasikan nama variabel ada beberapa aturan yang harus diperhatikan, yaitu :

1. Tidak boleh di awali dengan angka , misal nya : 1 kali lagi
2. Tidak menggunakan karakter khusus, misalnya : ?,!,dan lain lain
3. Tidak boleh mengandung spasi atau jarak
4. Maksimal 255 karakter.

Ketiga, fungsi document.get ElementById bergungsi untuk mencari sebuah tag HTML berdasarkan id. Selain documen.get ElementById, dalam DOM juga disediakan fungsi lain , seperti document.getElementByName, document.getElementByClass, dan lain-lain. 




<html>
<head>
<title>belajar javascript</title>
<style>
.tengah{
margin: auto;
width: 55%;
border: 3px solid brown;
padding: 10px;
background-color: pink;
}
label{
width: 100px;
display: inline-block;
}
</style>
<script language="javascript">
function inputOutput(){
//deklarasi variabel
var x;
//input
x = document.getElementById("txtInput").value;
//output
document.getElementById("txtOutput").value = x ;
}
</script>
</head>
<body>
<div class="tengah">
<h1 align="center">program input / output </h1>
<div>
<label>input</label>
<input type="text" id="txtInput"/>
</div>
<div>
<label>output</label>
<input type="text" id="txtOutput"/>
</div>
<div>
<input type="button" id="btnProses" value="proses" onclick="inputOutput()"/>
</div>
<div>
</body>
</html> 

Pilih Run , pilih Launch in Firefox atau Chrome, jadi nya akan seperti ini :


Isi input data lalu klik proses

Maka akan jadi seperti ini:


Sekian dulu ya guys untuk javascript nya... minta saran nya ya guys supaya saya bisa lebih baik lagi, terimakasih dan selamat mencoba..


Wassalamualaikum

Sabtu, 26 Agustus 2017

Dasar HTML

Assalamualaikum






Kembali lagi guys :D kali ini saya ingin berbagi tentang ilmu lagii . Tapi kali ini saya mau  njelasin tentang HTML. HTML itu apa sihh??? HTML yaitu kepanjangan dari Hyper Text Markup Language. HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa).

Dan, kali ini saya mau menunjukkan pembuatan dasar halaman web dengan HTML. Okee kita langsung mulai saja...

1. Buka aplikasi Notepad++ atau pakai aplikasi lain seperti Sublime Text, dll





















2. Lalu ketik struktur dasar HTML (jangan lupa di save ya..)















3. Edit warna teks dan lain lain.















Ket  :
<h2> untuk ukuran teks (h1,h2,h3,h4,h5,h6),
<marquee> untuk teks berjalan ,
</marquee></font></h2> setiap penutup jangan lupa di awali tanda /,
<p>untuk paragraf,
<align="justify"> teks rata kanan kiri,
Itu juga bisa di ganti warna background nya dengan cara <body bgcolor="yellow"> yellow itu misalnya ya guys, bisa juga di ganti warna-warna  lain,















Pilih run (terserah kalian mau pilih Firefox atau Chrome)

































Itu hasil akhirnya buat dasat html guys..

Dan itu isinya bebas ya guys mau kalian isi apa aja halaman dasar web nya, karena saya baru masuk dunia TI itu dulu ya guys.. hehehe, minta kritik dan saran nya ya guys agar saya bisa bekerja lebih baik lagi :D . Semoga bermanfaat untuk kita semua.. Terimakasih, silahkan mencoba~


Wassalamualaikum