Penempatan JavaScript di HTML - Halo semuanya, pada kesempatan kali ini kita semua akan mempelajari dasar-dasar JavaScript, dan pada artikel ini kita semua akan mempelajari beberapa cara untuk menempatkan kode JavaScript di HTML
Ada fleksibilitas yang diberikan untuk menyisipkan kode JavaScript di manapun dalam dokumen HTML. Tetapi cara yang paling direkomendasikan untuk memasukkan JavaScript ke dalam file HTML adalah sebagai berikut -
- Skrip di bagian <head>. </head>_
- Skrip di bagian <body>. </body>
- Skrip di bagian <body>. </body> dan <head>. </head>_
- Script dalam file eksternal dan kemudian sertakan di bagian <head>. </head>_
Di bagian berikut, kita akan melihat bagaimana kita dapat menempatkan JavaScript di file HTML dengan berbagai cara
JavaScript di bagian <head>. </head>_
Jika kita ingin skrip berjalan di beberapa acara, seperti saat pengguna mengklik di suatu tempat, maka Anda akan menempatkan skrip di antara kepala sebagai berikut -
<html> <head> <script type = "text/javascript"> function sayHello() { alert("Hello World") } </script> </head> <body> <input type = "button" title = "sayHello()" value = "Say Hello" /> </body> </html>JavaScript di bagian <body>. </body>
Jika kita memerlukan skrip untuk dijalankan saat halaman dimuat sehingga skrip menghasilkan konten pada halaman, maka skrip masuk ke bagian <body> dari dokumen
Dalam hal ini, kami tidak akan memiliki fungsi yang ditentukan menggunakan JavaScript. Lihatlah kode berikut
JavaScript dalam Bagian <body> dan <head>
Kami juga dapat menempatkan kode JavaScript di bagian <head> dan <body> kira-kira sebagai berikut -
<html> <head> <script type = "text/javascript"> function sayHello() { alert("Hello World") } </script> </head> <body> <script type = "text/javascript"> document.write("Hello World") </script> <input type = "button" title = "sayHello()" value = "Say Hello" /> </body> </html>JavaScript di File Eksternal
Saat kami mulai bekerja lebih ekstensif dengan JavaScript, kami akan cenderung menemukan bahwa ada beberapa kasus di mana kami menggunakan kembali kode JavaScript yang identik di beberapa halaman situs
Kami tidak dibatasi untuk mempertahankan kode identik di banyak file HTML. Tag Script menyediakan mekanisme untuk memungkinkan kita menyimpan JavaScript dalam file eksternal dan kemudian memasukkannya ke dalam file HTML
Berikut ini adalah contoh untuk menunjukkan bagaimana kami dapat menyertakan file JavaScript eksternal dalam kode HTML Anda menggunakan tag skrip dan atribut src-nya
<html> <head> <script type = "text/javascript" src = "filename.js" ></script> </head> <body> ....... </body> </html>Untuk menggunakan JavaScript dari file sumber eksternal, kita perlu menulis semua kode sumber JavaScript dalam file teks sederhana dengan ekstensi <html> <head> <script type = "text/javascript"> function sayHello() { alert("Hello World") } </script> </head> <body> <script type = "text/javascript"> document.write("Hello World") </script> <input type = "button" title = "sayHello()" value = "Say Hello" /> </body> </html> 4 dan kemudian menyertakan file seperti yang ditunjukkan di atas
Misalnya, kami dapat menyimpan konten berikut di file <html> <head> <script type = "text/javascript"> function sayHello() { alert("Hello World") } </script> </head> <body> <script type = "text/javascript"> document.write("Hello World") </script> <input type = "button" title = "sayHello()" value = "Say Hello" /> </body> </html> 5 dan kemudian kami dapat menggunakan fungsi sayHello di file HTML Anda setelah menyertakan file <html> <head> <script type = "text/javascript"> function sayHello() { alert("Hello World") } </script> </head> <body> <script type = "text/javascript"> document.write("Hello World") </script> <input type = "button" title = "sayHello()" value = "Say Hello" /> </body> </html> 5