Penggunaan JavaScript

<script> 标签

在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。

实例

<script>
document.getElementById("demo").innerHTML = "我的第一段 JavaScript";
</script>

亲自试一试

Keterangan:旧的 JavaScript 例子也许会使用 Contoh JavaScript lama mungkin akan menggunakan type

Keterangan:Properti: <script type="text/javascript">.

Properti type bukan wajib. JavaScript adalah bahasa skrip baku di HTML.

Fungsi dan peristiwa JavaScript JavaScriptfungsi

adalah blok kode JavaScript yang dapat dijalankan saat dipanggil.Contohnya, saat terjadiperistiwa

Peringatan:dalam peristiwa, seperti saat pengguna mengklik tombol.

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

JavaScript di dalam <head> atau <body>

Anda dapat menempatkan sejumlah skrip apapun di dokumen HTML. <body> atau <head> Skrip dapat ditempatkan di bagian

bagian JavaScript di dalam <head>

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

Fungsi ini akan dipanggil saat tombol di klik:

实例

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

亲自试一试

JavaScript di dalam <body> halaman HTML

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

Fungsi ini akan dipanggil saat tombol di klik:

实例

<!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>

亲自试一试

Peringatan:Tempatkan skrip di <body> dibawah elemen, dapat memperbaiki kecepatan tampilan, karena pengkompilasi skrip dapat menunda tampilan.

Skrip luaran

Skrip dapat ditempatkan di dalam berkas luaran:

Berkas luar: myScript.js

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

Skrip luaran sangat berguna, jika skrip yang sama digunakan di banyak halaman web yang berbeda.

Ekstensi berkas JavaScript adalah .js.

Untuk menggunakan skrip luaran, silakan <script> tanda src dalam properti (source) untuk menetapkan nama skrip:

实例

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

亲自试一试

Anda boleh <head> atau <body> tempatkan referensi skrip luaran.

Pertunjukan skrip ini dengan diubah di tempat <script> tanda ini adalah sama.

Keterangan:Lakon luaran tidak boleh mengandungi <script> 标签。

外部 JavaScript 的优势

在外部文件中放置脚本有如下优势：

  • 分离了 HTML 和代码
  • 使 HTML 和 JavaScript 更易于阅读和维护
  • 已缓存的 JavaScript 文件可加速页面加载

如需向一张页面添加多个脚本文件 - 请使用多个 script 标签：

实例

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

外部引用

可通过完整的 URL 或相对于当前网页的路径引用外部脚本：

本例使用完整的 URL 来链接至脚本：

实例

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

亲自试一试

本例使用了位于当前网站上指定文件夹中的脚本：

实例

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

亲自试一试

本例链接了与当前页面相同文件夹的脚本：

实例

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

亲自试一试

您能够在 HTML 文件路径中学习更多有关文件路径的知识。