Cara menggunakan javascript course

Javascript adalah bahasa pemrograman tingkat tinggi dan dinamis. Javascript populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT. Pada tutorial kali ini saya akan membahas tentang Cara Menambahkan Class Menggunakan Javascript.

Table of Contents Show

Apa bedanya Java dan JavaScript?
Apa itu JavaScript dan fungsinya?
Apa itu syntax dalam JavaScript?
Kenapa diberi nama JavaScript?

Pada javascript kita mengenal elemen classList yang mempunyai metode add() untuk menambahkan class pada suatu elemen di dalam html. Di dalam kasus yang saya akan bahas kali ini saya akan mencoba salah satu metode yang ada di classList yaitu metode add(). Berikut adalah langkah-langkah Cara Menambahkan Class Menggunakan Javascript:

– Pertama teman-teman buka text editor teman-teman dan ketikan kode html di bawah ini:

<!DOCTYPE html>
<html>
<head>
<title>addClass</title>
<style type="text/css">
.aqua {
  background: aqua;
}
</style>
</head>
<body>

<p class="contoh aqua">Elemen dengan class "contoh dan aqua"</p><!--Elemen yang sudah di beri dua class-->
<p class="contoh">Elemen yang memiliki class "contoh" saja</p><!--Elemen yang akan di tambahkan class aqua-->

<button id="btn">Tambahkan class aqua</button><!--Untuk memproses kode javascript-->


</body>
</html>

Keterangan sudah berada dalam commenting di tag html di atas. Coba teman-teman jalankan di browser teman-teman, maka akan tampil seperti gambar di bawah ini:

– Kedua, teman-teman tuliskan kode javascript di bawah tag button, dan berikut kodenya:

<script>
var  element = document.getElementById("btn");
var paragraf = document.querySelectorAll(".contoh");
element.onclick = function(){
	paragraf[1].classList.add("aqua");
}
</script>

Penjelasan kode javascript di atas:

– variabel element: berfungsi untuk mengambil id dari button untuk proses onclick.

– variabel paragraf : untuk menyeleksi semua class .contoh yang berada di elemen p

– paragraf[1].classList.add(“aqua”): berfungsi untuk memilih paragraf mana yang akan kita tambahkan class aqua. karena kita hanya memiliki dua elemen maka elemen 1 atau paragraf ke-dua lah yang akan kita tambahkan class.

setelah selesai mengetikan kode javascript di atas, coba teman-teman refresh file html yang ada di browser tadi lalu klik buttonnya, maka elemen 1 atau paragraf ke dua akan terkena efek dari class aqua:

Bagaimana teman-teman cukup mudahkan Menambahkan Class Menggunakan Javascript. Dengan java script kita bisa dengan mudah menambahkan class pada elemen yang kita inginkan.

Sekian tutorial kali ini tentang Cara Menambahkan Class Menggunakan Javascript. Selamat mencoba teman-teman.

Selamat datang di course Pemrograman JavaScript dari Pemula sampai Mahir. Disini kita akan belajar Pemrograman JavaScript dari tingkat dasar sampai tingkat mahir, disertai dengan studi kasus. Akan banyak materi yang akan dibahas di course ini seperti :

Pemrograman JavaScript Dasar, disini kita akan belajar tentang dasar-dasar pemrograman JavaScript. Ini adalah materi awal yang wajib dikuasai
Pemrograman JavaScript Object Oriented Programming, disini kita akan belajar pemrograman berorientasi objek di JavaScript, salah satu paradigma paling populer saat ini
Pemrograman JavaScript Modules, disini kita akan belajar cara membuat aplikasi javascript yang modular, sehingga mudah digunakan
Pemrograman JavaScript Document Object Model, disini kita akan belajar bagaimana interaksi antara javascript dan html dan juga css, sehingga bisa membuat halaman web lebih kaya akan interaksi
Pemrograman JavaScript Async, disini kita akan belajar bagaimana asynchronous programming di javascript, seperti mengambil data dari server, dan lain-lain
Pemrograman JavaScript Web API, kita akan bahas banyak web api yang tersedia di javascript
Studi Kasus Menggunakan JavaScript, dan course ini akan dilengkapi banyak studi kasus

Materi akan selalu di update secara berkala, dan ketika materi di update, harga course pun akan diupdate dengan harga baru. Jadi pastikan untuk secepatnya membeli course ini, makin cepat, makin murah harga pembelian course ini.

Course ini juga didukung dengan private group DISCORD sehingga kita bisa berdiskusi sesama member ketika terjadi masalah di course ini.

Fokus pemrograman JavaScript ini akan mengarah ke frontend, sedangkan untuk materi javascript backend akan dibuat dalam course terpisah dengan tema NodeJS.

Pada materi ini, kita tidak akan membahas tentang HTML dan CSS, jadi pastikan teman-teman sudah menguasai tentang HTML dan juga CSS, karena pada course ini, tidak akan membahas HTML dan CSS.

Apa bedanya Java dan JavaScript?

Java maupun JavaScript merupakan bahasa yang dikembangkan dari bahasa lainnya. Penamaan serta konvensi JavaScript mungkin memang mirip dengan Java, tetapi JavaScript sendiri sama sekali tidak mengandung bahasa pemrograman Java. JavaScript dikembangkan dari bahasa C, sedangkan Java dikembangkan dari bahasa C/C++.

Apa itu JavaScript dan fungsinya?

Bicara teknis, JavaScript atau kita singkat menjadi JS merupakan bahasa pemrograman jenis interpreter, sehingga kamu tidak memerlukan compiler untuk menjalankannya. JavaScript memiliki fitur-fitur seperti berorientasi objek, client-side, high-level programming, dan loosely typed.

Apa itu syntax dalam JavaScript?

Sintaks JavaScript adalah seperangkat aturan yang menentukan program JavaScript yang terstruktur dengan benar. JavaScript terdiri dari pernyataan JavaScript yang ditempatkan di dalam tag HTML <script> </script> di halaman web, atau di dalam file JavaScript eksternal yang memiliki ekstensi . js.

Kenapa diberi nama JavaScript?

" Microsoft memperkenalkan web browser Internet Explorer 3 dengan JScript. JScript merupakan nama lain JavaScript, Microsoft melakukan ini dikarenakan JavaScript merupakan merk dagang yang dimiliki Sun dan Netscape. Sehingga Microsoft mencari nama lain untuk versi JavaScript mereka.