Penggunaan JavaScript

<script> tanda kuti

Di HTML, kode JavaScript harus berada di dalam <script> dengan </script> diantara tanda kuti.

Contoh

<script>
document.getElementById("demo").innerHTML = "Saya pertama JavaScript saya";
</script>

Coba sendiri

Keterangan:Contoh lama JavaScript mungkin menggunakan type Properti: <script type="text/javascript">.

Keterangan:Properti type tidak diperlukan. JavaScript adalah bahasa skrip baku di HTML.

Fungsi dan peristiwa JavaScript

JavaScript FungsiAdalah blok kode JavaScript yang dapat dijalankan saat dipanggil.

Contohnya, saat terjadiperistiwaperistiwa, seperti saat pengguna menekan tombol.

Pemberitahuan:Panggil fungsi saat terjadi

Anda akan belajar lebih banyak tentang fungsi dan peristiwa di bab selanjutnya.

JavaScript di dalam <head> atau <body>

Anda dapat menempatkan skrip sebanyak-banyaknya di dokumen HTML. <body> atau <head> Skrip dapat disisipkan di bagian

Bagian JavaScript di dalam <head>

Dalam contoh ini, fungsi JavaScript ditempatkan di <head> Bagian.

Fungsi ini akan dipanggil saat tombol di klik:

Contoh

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraf diubah.";
}
</script>
</head>
<body>
<h1>Satu halaman web</h1>
<p id="demo">Paragraf satu</p>
<button type="button" onclick="myFunction()">Coba</button>
</body>
</html>

Coba sendiri

JavaScript di dalam <body> halaman HTML

Dalam contoh ini, fungsi JavaScript ditempatkan di <body> Bagian.

Fungsi ini akan dipanggil saat tombol di klik:

Contoh

<!DOCTYPE html>
<html>
<body> 
<h1>Halaman Web</h1>
<p id="demo">Paragraf satu</p>
<button type="button" onclick="myFunction()">Coba</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraf diubah.";
}
</script>
</body>
</html>

Coba sendiri

Pemberitahuan:Tempatkan skrip di <body> dibawah elemen, dapat meningkatkan kecepatan tampilan, karena pengompilasi skrip dapat menunda tampilan.

Skrip eksternal

Skrip dapat disisipkan di dalam berkas eksternal

Berkas eksternal: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraf diubah.";
}

Skrip eksternal sangat praktis, jika skrip yang sama digunakan di banyak halaman web yang berbeda.

Ekstensi berkas berkas JavaScript adalah .js.

Untuk menggunakan skrip eksternal, silakan <script> tanda tag src (sumber) Atur nama skrip di properti

Contoh

<script src="myScript.js"></script>

Coba sendiri

Anda dapat menempatkan di <head> atau <body> untuk merujuk skrip eksternal.

Pertunjukan skrip ini dengan dia disisipkan <script> tanda tag adalah sama.

Keterangan:Skrip external tidak boleh mengandung <script> Tanda.

Keunggulan JavaScript Eksternal

Menempatkan kode di berkas eksternal memiliki keunggulan diantaranya:

  • Pemisahan HTML dan kode
  • Membuat HTML dan JavaScript mudah dibaca dan dipekerjaan
  • Berkas JavaScript yang disimpan dapat mempercepat pengambilan halaman

Untuk menambahkan berbagai berkas skrip ke halaman - gunakan beberapa tag script:

Contoh

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

Penggunaan Luar

Dapat diakses melalui URL penuh atau jalur yang berbeda untuk halaman saat ini:

Contoh ini menggunakan URL penuh untuk menghubungkan ke skrip:

Contoh

<script src="https://www.codew3c.com/js/myScript1.js"></script>

Coba sendiri

Contoh ini menggunakan skrip yang berada di dalam folder yang ditentukan di situs saat ini:

Contoh

<script src="/js/myScript1.js"></script>

Coba sendiri

Contoh ini menghubungkan skrip yang sama dalam folder folder halaman saat ini:

Contoh

<script src="myScript1.js"></script>

Coba sendiri

Anda dapat Jalur Berkas HTMLBelajar lebih banyak tentang jalur berkas di sini.