HTML noscript: Konten Cadangan Saat JavaScript Dinonaktifkan

HTML <noscript> berisi konten cadangan untuk situasi di mana browser tidak dapat menggunakan skrip. Ini tidak mendeteksi unduhan JavaScript yang gagal atau kesalahan runtime, jadi Anda harus menerapkan pesan kesalahan secara terpisah.

Skrip yang dinonaktifkan dan eksekusi yang gagal adalah berbeda

Ketika browser dikonfigurasi untuk menjalankan skrip, konten di dalam noscript tidak ditampilkan sebagai konten halaman biasa. File yang hilang, kesalahan sintaks, atau pengecualian runtime tidak otomatis mengalihkan halaman ke noscript. Jika pembaca memerlukan panduan ketika sebuah fitur gagal, pertimbangkan untuk memberikan pesan dalam HTML dasar dan memperbaruinya hanya setelah skrip berhasil.

Contoh lengkap: bandingkan eksekusi yang berhasil dan kesalahan

Simpan dokumen berikut sebagai noscript-demo.html dan buka di browser. Dengan JavaScript diaktifkan, pesan awal akan berubah menjadi pesan berhasil. Contoh ini tidak menggunakan pustaka eksternal atau permintaan ke server.

<!doctype html>
<html lang="id">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Perbandingan perilaku noscript</title>
</head>
<body>
  <h1>Latihan status skrip</h1>
  <p id="status">Skrip belum memperbarui pesan ini.</p>
  <noscript>
    <p>Skrip saat ini tidak tersedia. Baca panduan dasar di bawah.</p>
  </noscript>
  <p>Panduan dasar: halaman ini dapat dibaca tanpa skrip.</p>
  <script>
    if (new URLSearchParams(location.search).has('fail')) {
      throw new Error('Kesalahan runtime untuk latihan');
    }
    document.getElementById('status').textContent = 'Skrip telah dijalankan.';
  </script>
</body>
</html>

1. Buka dokumen dengan skrip diaktifkan. Halaman menampilkan Skrip telah dijalankan. dan petunjuk dasar, sementara pesan noscript tetap tersembunyi.
2. Buka kembali dengan ?fail=1 ditambahkan ke alamat. Kesalahan demo meninggalkan pesan awal di tempatnya, tetapi pesan noscript tidak muncul karena skrip masih diaktifkan. Anda dapat memeriksa kesalahan demo di konsol alat pengembang.
3. Nonaktifkan JavaScript untuk halaman ini menggunakan pengaturan browser atau alat pengembang, lalu muat ulang untuk menampilkan pesan noscript. Menghapus elemen script saja adalah tes yang berbeda.
4. Setelah latihan, pulihkan pengaturan JavaScript asli, hapus string kueri dari alamat, dan muat ulang halaman.

Jika lingkungan Anda membatasi string kueri pada alamat file, sajikan file yang sama melalui server web lokal untuk perbandingan. Menu dan ruang lingkup penonaktifan skrip bervariasi menurut browser dan alat pengembang, jadi periksa pengaturan yang relevan. Terapkan perubahan sementara pada halaman latihan dan kembalikan setelahnya, daripada menonaktifkan skrip di seluruh browser.

Mempertahankan konten dasar dan panduan di body

Letakkan paragraf cadangan biasa dan tautan di dalam body, seperti yang dilakukan contoh. Konten yang diizinkan dari noscript di dalam head terbatas, jadi jangan letakkan paragraf atau tombol di sana. Jangan menanamkan satu noscript di dalam yang lain.

Jika JavaScript menghasilkan semua penjelasan penting atau opsi kontak, pembaca mungkin kehilangan akses ketika JavaScript tidak dijalankan. Sediakan konten dalam HTML awal kapan pun memungkinkan, kemudian tingkatkan secara bertahap bagian-bagian yang memerlukan interaksi. Ini mengurangi ketergantungan hanya pada pesan cadangan. Jangan berasumsi noscript menyediakan pemulihan kesalahan atau fitur keamanan; referensi noscript referensi noscript di MDN menjelaskan kondisi tampilannya.