PEMAHAMAN JAVASCRIPT
PEMAHAMAN JAVASCRIPT
APA ITU JAVASCRIPT?
Javascript adalah salah satu Bahasa pemrograman yang saat
ini sedang banyak digunakan oleh para developer hal ini dikarenakan javascript
merupakan Bahasa pemrograman yang fleksibel yang dapat digunakan untuk web
depeloment ataupun memuat aplikasi baik di PC atau di smartphone. JS sendiri
diciptakan oleh seorang karyaman Netscape yaitu Brendan Eich pada tahun
1995,Bahasa pemrograman ini pada mulainya hanya digunakan di lingkungan
Perusahaan Netscape awalnya nama dari JS ini diberi nama Mocha lalu berubah
menjadi Mona dan livescript sampai akhirnya memakai nama Javascirpt hingga
sekarang
PROJECRT 1
TUTORIAL MEMBUAT KONVERSI SUHU
Dalam project kali ini kita abil contoh pengkonversian suhi dari farenhait ke celsius
disclaimer: ini mengunakan javascript eksternal
BERIKUT INI CONTOH KODENYA:
KODE HTML
<h1>project 1</h1>
<button onclick="suhu()"> clickme</button>
<p id="total"></p>
KODE JAVASCRIPT
function suhu(){
var celcius = prompt('masukan derajat?')
var far = (celcius-32)*5/9
if(isNaN(far)){
alert('tidak valid')
}
else{
document.getElementById('total').innerHTML= 'jadi' + celcius +'derajat farenhait
adlah' + far.toFixed(2) +'derajat celcius'
}
}
DAN INI HASILNYA
PROJECT 2
TUTORIAL MEMBUAT LIST DAN SEBUAH BUTTON,JIKA BUTTON DI KLIK,SETIAP ITEM LIST YANG GENAP AKAN BERUBAH MENJADI BIRU DAN TEBAL
BERIKUT CONTOH KODENYA
KODE HTML:
<style>
.warna{
color: blue;
font-weight: bold;
}
</style>
</head>
<body>
<h1>project 2</h1>
<li>number1</li>
<li>number2</li>
<li>number3</li>
<li>number4</li>
<li>number5</li>
<button onclick="ubahitem()">click ini</button>
KODE JAVASCRIPT
function ubahitem(){
var listItem = document.getElementsByTagName('li')
for(var i = 0; i < listItem.length; i++){
if((i+1) % 2 == 0){
listItem[i].classList.add('warna')
}
}
}
DAN INI HASILNYA:
PROJECT 3
Tutorial membuat sebuah jam digital. Bagian detik ticking. Jika detik ganjil, warna border menjadi biru, jika genap menjadi merah
BERIKUT CONTOH KODENYA:
KODE HTML
<div id="clock" style="width: 200px; font-size: 30px;"></div>
KODE JAVASCRIPT
function updateTime() {
var clock = document.getElementById("clock");
var now = new Date();
var seconds = now.getSeconds();
clock.textContent = now.toLocaleTimeString();
if (seconds % 2 === 0) {
clock.style.border = "2px solid red";
} else {
clock.style.border = "2px solid blue";
}
}
setInterval(updateTime, 1000);
window.onload = function() {
updateTime();
};
DAN INI HASILNYA
Komentar
Posting Komentar