Pages

w3codez © 2015. Powered by Blogger.

adchoices

adchoices

Menambahkan elemen array dengan menggunakan javascript

Kali ini Saya akan memberikan script yang bisa Anda gunakan terutama sebagai bahan pembelajaran. Dimana pada postingan kali ini, variabel yang tampil bisa ditambahkan dengan menggunakan suatu fungsi pada script. Saya mengeksekusi script tersebut dengan menggunakan beberapa tombol. Setelah tombol tersebut di klik, maka akan muncul variabel tambahan sesuai dengan tombol yang di klik dimana pada tiap tombol memiliki fungsinya masing-masing. Tombol 'tambah mobil' untuk menambahkan variabel dengan nama 'mobil' dan seterusnya. Nah, berikut ini scriptnya:

<button onclick="fungsiMobil()">tambah mobil</button>
<button onclick="fungsiSepedah()">tambah sepedah</button>

<div id="test"></div>
<script>
var kendaraan = ["mobil", "sepedah", "motor", "pesawat"];
document.getElementById("test").innerHTML = kendaraan;

function fungsiMobil() {
    kendaraan[kendaraan.length] = "mobil";
    document.getElementById("test").innerHTML = kendaraan;
}
function fungsiSepedah() {
    kendaraan[kendaraan.length] = "sepedah";
    document.getElementById("test").innerHTML = kendaraan;
}
</script>

Nanti hasilnya akan seperti ini:





Bila Anda ingin menambahkan variabel motor dan juga pesawat, nanti scriptnya akan seperti ini;

<button onclick="fungsiMobil()">tambah mobil</button>
<button onclick="fungsiSepedah()">tambah sepedah</button>
<button onclick="fungsiMotor()">tambah motor</button>
<button onclick="fungsiPesawat()">tambah pesawat</button>
<div id="test"></div>
<script>
var kendaraan = ["mobil", "sepedah", "motor", "pesawat"];
document.getElementById("test").innerHTML = kendaraan;

function fungsiMobil() {
    kendaraan[kendaraan.length] = "mobil";
    document.getElementById("test").innerHTML = kendaraan;
}
function fungsiSepedah() {
    kendaraan[kendaraan.length] = "sepedah";
    document.getElementById("test").innerHTML = kendaraan;
}
function fungsiMotor() {
    kendaraan[kendaraan.length] = "motor";
    document.getElementById("test").innerHTML = kendaraan;
}
function fungsiPesawat() {
    kendaraan[kendaraan.length] = "pesawat";
    document.getElementById("test").innerHTML = kendaraan;
}
</script>

Silahkan Anda coba sendiri.

Sekian, semoga bermanfaat. Mohon maaf apabila ada kesalahan. Terima kasih atas kunjungannya.

No comments:

Post a Comment

 

Most Reading

Ads 200x200

Ads 200x200