Hallo sobat program, ketemu lagi dengan saya Rizal dan masih diwebsite dumetschool. Dan dipembahasan ini adalah pembahasan lanjutan dari yang kemarin tentang createTextNode dan kali ini kita akan membahas tentang Cara Menggunakan Fungsi createElement Javascript.
Nantinya kita akan membuat sebuah element HTML baru dijavascript dengan menggunakan fungsi createElement lalu kita mix atau kita gabungkan dengan fungsi createTextNode.
Sebelum kita mulai penjelasan singkat tentang fungsi createElement ini adalah sebuah fungsi dari javascript untuk membuat element HTML baru. Dan sering digunakan bersamaan dengan createTextNode.
Oke dari penjelasan diatas saya harap sudah ada bayangannya, jadi langsung saja ya kita coba Cara Menggunakan Fungsi createElement Javascript.
Langkah pertama jalankan/run text-editornya lalu kemudian ketiklah kode HTML nya seperti pada contoh dibawah ini :
1 2 3 4 5 6 7 8 9 10 |
<!DOCTYPE html> <html> <body> <h2>DUMET SCHOOL</h2> <button onclick="myFunction()">Try it</button> </body> </html> |
Jika sudah langkah selanjutnya teman-teman tambahkan kode javascript beserta fungsi createElement dan createTextNode seperti pada contoh dibawah ini :
1 2 3 4 5 6 7 8 |
<script> function myFunction() { var element = document.createElement("h3"); var text = document.createTextNode("Terbaik dan Nomor Satu"); element.appendChild(text); document.body.appendChild(element); } </script> |
Jika sudah silahkan langsung disimpan dan coba dijalankan dibrowser yang teman-teman gunakan, jika benar maka hasilnya akan nampak seperti pada contoh dibawah ini :
Oke jadi seperti itulah pembahasan kita kali ini tentang Cara Menggunakan Fungsi createElement Javascript. Dan silahkan teman-teman explore lagi dari fungsi createElement tsb.
Sampai disini dahulu pembahasan kita kali ini tentang Cara Menggunakan Fungsi createElement Javascript. Semoga dapat sangat bermanfaat buat teman-teman dan sampai bertemu dipembahasan selanjutnya.
Terimakasih
Sumber: w3school