Dimana kita dapat menempatkan code javascript pada HTML, apakah diantara elemen html atau diluar elemen html? Untuk menemukan jawabannya simak bab berikut. Show
Section Artikel Tag <script>Dalam HTML, kode JavaScript akan disisipkan di antara tag <script> dan </script> . Contoh: <!DOCTYPE html> <html> <body> <h2>JavaScript pada Body</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "JavaScript Pertamaku </script> </body> </html> Contoh JavaScript lama mungkin menggunakan atribut type: <script type=”text/javascript”>. Atribut type tidak diperlukan lagi. JavaScript adalah bahasa script default dalam HTML. Function dan Event JavaScriptFunction JavaScript adalah sekumpulan kode JavaScript, yang dapat dijalankan saat “dipanggil”. Misalnya, suatu function dapat dipanggil saat suatu event terjadi, seperti saat pengguna mengklik tombol. JavaScript di <head> atau <body>Anda dapat menempatkan sejumlah script JavaScript dalam dokumen HTML. JavaScript dapat ditempatkan di tag <head> atau <body> pada bagian halaman HTML, atau keduanya. JavaScript di <head>Dalam contoh ini, function JavaScript ditempatkan di <head> pada halaman HTML. Function tersebut dipanggil (invoked) ketika sebuah tombol diklik. Contoh : <!DOCTYPE html> <html> <head> <script> function myFunction() { document.getElementById("demo").innerHTML = "Merubah Paragraf."; } </script> </head> <body> <h2>JavaScript di Head</h2> <p id="demo">Sebuah paragraf.</p> <button type="button" onclick="myFunction()">Klik disini</button> </body> </html> JavaScript di <body>Dalam contoh ini, function JavaScript ditempatkan di bagian <body> pada halaman HTML. Function tersebut dipanggil (invoked) ketika sebuah tombol diklik. Contoh : <!DOCTYPE html> <html> <body> <h2>JavaScript pada bagian Body</h2> <p id="demo">Sebuah paragraf.</p> <button type="button" onclick="myFunction()">Klik disini</button> <script> function myFunction() { document.getElementById("demo").innerHTML = "Paragraph diubah."; } </script> </body> </html> Menempatkan script di bagian bawah elemen <body> meningkatkan kecepatan tampilan, karena interpretasi script memperlambat tampilan. JavaScript EksternalJavaScript juga dapat ditempatkan di file eksternal. External file: myScript.jsfunction myFunction() { document.getElementById("demo").innerHTML = "Paragraph changed."; } Script eksternal akan praktis jika kode yang sama digunakan di banyak halaman web yang berbeda. File JavaScript memiliki ekstensi file .js. Untuk menggunakan script eksternal, letakkan nama file script di atribut src (sumber) dari tag <script>. Contoh : <!DOCTYPE html> <html> <body> <h2>External JavaScript</h2> <p id="demo">Sebuah paragraf.</p> <button type="button" onclick="myFunction()">Klik disini</button> <p>(myFunction disimpan dalam file eksternal yang disebut "myScript.js")</p> <script src="myScript.js"></script> </body> </html> Penempatan script eksternal dapat diletakan pada <head> atau <body> sesuai dengan yang diinginkan. Script eksternal tidak boleh berisi tag <script> Manfaat JavaScript EksternalMenempatkan script di file eksternal memiliki beberapa keuntungan:
Untuk menambahkan lebih dari satu file script ke sebuah halaman – gunakan beberapa tag script seperti berikut. <script src="myScript1.js"></script> <script src="myScript2.js"></script> Referensi EksternalScript eksternal dapat direferensikan dengan URL lengkap atau dengan relative path pada halaman web saat ini. Halo sobat Webhozz berjumpa lagi dengan saya, kali ini saya ingin membagikan artikel mengenai penempatan JavaScript. Agar sobat Webhozz tidak bingung langsung aja yuk kita masuk ke pembahasan artikelnya sobat Webhozz. Seperti CSS, kode JavaScript bisa diletakkan secara internal di dalam dokumen HTML, maupun diletakkan secara eksternal dalam sebuah file berekstensi .js. Seperti halnya CSS, metode penempatan JavaScript secara eksternal lebih direkomendasikan. Selain memudahkan pengelolaan kodenya karena terpisah dari dokumen HTML, file JavaScript akan di-cache browser sehingga mempercepat waktu muat halaman web di sesi berikutnya. Jika diletakkan secara internal, kode JavaScript bisa disisipkan di bagian elemen head maupun elemen body. Berbeda dengan CSS yang lebih disarankan untuk didefinisikan di bagian elemen head, kode JavaScript lebih disarankan untuk diletakkan di elemen body pada bagian akhir. Pertimbangannya karena halaman web menjadi lebih cepat dimuat, tidak terbebani waktu untuk memuat kode JavaScript terlebih dahulu. Hal ini juga berlaku pada metode perujukan file eksternal JavaScript. Penulisan kode JavaScript secara internal di dokumen HTML diletakkan antara tag pembuka <script> dan tag penutup </script>. Untuk merujuk file JavaScript eksternal di dokumen HTML, sisipkan URL file-nya menggunakan atribut src di tag pembuka <script>: Sebagai catatan, pada teknik lama, penulisan tag pembuka <script> disertai atribut type, yaitu: Namun cara ini sudah tidak diperlukan. Melalui HTML5, kalian cukup menggunakan tag pembuka <script> tanpa disertai atribut type, seperti yang dicontohkan di awal. Nah sobat Webhozz itulah pembahasan singkat mengenai penempatan javascript. Semoga pembahasan artikel ini dapat membantu sobat Webhozz semua dalam mempelajari javascript, dan juga dapat menambah pengetahuan sobat Webhozz semua. Sampai berjumpa lagi pada pembahasan artikel-artikel lainnya yang tentunya lebih menarik lagi. Bagaimana kode JavaScript disisipkan atau ditempatkan pada dokumen HTML?Kode-kode Javascript disimpan pada sebuah file dengan ekstension '.js'. Kemudian file eksternal ini dapat dipanggil dari dokumen HTML dengan menggunakan atribut 'src' dari tag <script>. File eksternal ini dapat digunakan oleh banyak dokumen HTML.
Dimana menuliskan coding JavaScript?Console Javascript dapat kita buka melalui Inspect Element->Console. Di dalam console, kita bisa menulis fungsi atau kode-kode javascript dan hasilnya akan langsung ditampilkan.
Apa itu kode JavaScript?Javascript adalah bahasa pemrograman yang awalnya dirancang untuk berjalan di atas browser. Namun, seiring perkembangan zaman, javascript tidak hanya berjalan di atas browser saja. Javascript juga dapat digunakan pada sisi Server, Game, IoT, Desktop, dsb.
Bagaimana cara membuat sebuah fungsi di JavaScript?Ada 4 cara yang bisa kita lakukan untuk membuat fungsi di Javascript:. Menggunakan cara biasa;. Menggunakan ekspresi;. Menggunakan tanda panah ( => );. dan menggunakan Constructor.. |