Aplikasi Menentukan Bilangan Ganjil Genap Dengan Javascript

Publish Date : 06-08-2024 , dibaca 59 kali, Hari ini dibaca : 1 kali ,0 comments

Halo Teman-Teman Semua , Pada artikel kali ini kita akan membuat Sebuah Aplikasi Sederhana Untuk Menentukan Bilangan Ganjil dan Bilangan Genap dengan menggunakan Javascript

DEMO

Untuk Membuat nya cukup Mudah :

Siapkan sebuah text editor , dan buat file dengan nama "ganjilgenap.html" ,atau sesuai dengan keinginan teman-teman :

ganjilgenap.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Menentukan Bilangan Ganjil dan Genap</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h2>Menentukan Bilangan Ganjil dan Genap <br>Senterwebs.Com</h2>
    <label>Masukkan Angkanya : </label>
    <input type="number" id="txt1">
    <button onclick="cek();">Cek</button>
    <div id="hasil"></div>
    </div>
    
</body>
</html>

Kemudian buat script Javascript di bawah tag </body> pada file diatas sbb:

<script>
    function cek(){
        var angka;
        angka = parseInt(document.getElementById('txt1').value);
        if (angka % 2 == 0){
            document.getElementById('hasil').innerHTML = " "+angka+" <br> Bilangan Genap ";
        }else{
            if (!isNaN(angka)){
            document.getElementById('hasil').innerHTML = " "+angka+" <br> Bilangan Ganjil ";
            }else{
            alert("Masukkan Angkanya");
            document.getElementById('txt1').focus();
            return false;
            }
        }
        
    }
</script>

Kemudian buat file baru dengan nama "style.css" , dengan script sbb:

style.css

@import url(http://fonts.googleapis.com/css?family=Bree+Serif);

body{
    background-color: aquamarine;
    font-family: 'Bree Serif', 'serif';
}
input{
    width: 100%;
    padding:10px;
    border: 1px solid #ccc;
    margin-top: 8px;
    margin-bottom:15px;
    box-sizing: border-box;
}
.container {
    width: 400px;
    background-color:#fff;
    margin:0 auto;
    padding: 10px;
}
h2{
    text-align: center;
}
#hasil{color:cadetblue;font-weight: bold;font-size: 50px;text-align: center;}

Simpan ke dua file tersebut dalam 1 folder , dan jalankan hasilnya . Terimakasih

Menghitung Selisih Hari antara dua Tanggal dengan Javascript
Previous Post

Produk Rekomendasi

Ebook Membuat Website Dinamis PHP MYSQLi + Source Code

Ebook Membuat Website Dinamis PHP V.2 + Source Code

Aplikasi Alumni Berbasis Website (Update RESPONSiVE) + Source Code

Tutorial Blog dan Website PHP MYSQLi

Contact Us

Statistik

Tags

Aplikasi Menentukan Bilangan Ganjil Genap Dengan Javascript

ganjilgenap.html

style.css

Produk Rekomendasi

Artikel Terkait

Diskusi

Youtube Tutorial

Random Posts