Bisakah Skrip Kode Simpan ke File Eksternal?

Penempatan Script Java langsung ke file yang berisi HTML untuk halaman web sangat ideal untuk skrip pendek yang digunakan saat belajar JavaScript. Ketika Anda mulai membuat skrip untuk menyediakan fungsionalitas yang signifikan untuk halaman web Anda, namun, jumlah JavaScript bisa menjadi sangat besar, dan termasuk skrip besar ini langsung di halaman web menimbulkan dua masalah:

  • Ini dapat mempengaruhi peringkat halaman Anda dengan berbagai mesin pencari jika JavaScript mengambil bagian mayoritas dari konten halaman. Ini menurunkan frekuensi penggunaan kata kunci dan frasa yang mengidentifikasi tentang konten.
  • Itu membuat lebih sulit untuk menggunakan kembali fitur JavaScript yang sama pada banyak halaman di situs web Anda. Setiap kali Anda ingin menggunakannya pada halaman yang berbeda, Anda harus menyalinnya dan memasukkannya ke dalam setiap halaman tambahan, ditambah setiap perubahan yang diperlukan lokasi baru.

Jauh lebih baik jika kita membuat JavaScript tidak tergantung pada halaman web yang menggunakannya.

instagram viewer

Memilih Kode JavaScript untuk Dipindahkan

Untungnya, itu pengembang HTML dan JavaScript telah memberikan solusi untuk masalah ini. Kita dapat memindahkan JavaScripts kita dari halaman web dan masih memiliki fungsinya persis sama.

Hal pertama yang perlu kita lakukan untuk membuat JavaScript di luar halaman yang menggunakannya adalah memilih kode JavaScript yang sebenarnya itu sendiri (tanpa tag skrip HTML sekitarnya) dan salin menjadi kode terpisah mengajukan.

Misalnya, jika skrip berikut ada di halaman kami, kami akan memilih dan menyalin bagian dengan huruf tebal:

Dulu ada praktik menempatkan JavaScript dalam dokumen HTML di dalam tag komentar untuk menghentikan browser lama menampilkan kode; Namun, standar HTML baru mengatakan bahwa browser harus secara otomatis memperlakukan kode di dalamnya Tag komentar HTML sebagai komentar, dan ini mengakibatkan browser mengabaikan Javascript Anda.

Jika Anda telah mewarisi halaman HTML dari orang lain dengan JavaScript di dalam tag komentar, maka Anda tidak perlu memasukkan tag dalam kode JavaScript yang Anda pilih dan salin.

Misalnya, Anda hanya akan menyalin kode tebal, meninggalkan tag komentar HTML dan dalam contoh kode di bawah ini:

Menyimpan Kode JavaScript sebagai File

Setelah Anda memilih kode JavaScript yang ingin Anda pindahkan, rekatkan ke file baru. Beri nama file yang menunjukkan apa yang dilakukan skrip atau mengidentifikasi halaman tempat skrip berada.

Berikan file a .js agar Anda tahu file tersebut berisi JavaScript. Misalnya kita mungkin menggunakan hello.js sebagai nama file untuk menyimpan JavaScript dari contoh di atas.

Menautkan ke Script Eksternal

Sekarang kita telah menyalin dan menyimpan JavaScript ke file yang terpisah, yang perlu kita lakukan adalah mereferensikan file skrip eksternal pada file kita Dokumen halaman web HTML.

Pertama, hapus semua di antara tag skrip:

Ini belum memberi tahu laman tentang apa yang harus dijalankan JavaScript, jadi kita selanjutnya perlu menambahkan atribut tambahan ke tag skrip itu sendiri yang memberi tahu browser tempat menemukan skrip.

Contoh kita sekarang akan terlihat seperti ini:

src = "hello.js">

Atribut src memberi tahu browser nama file eksternal dari mana kode JavaScript untuk halaman web ini harus dibaca (yaitu hello.js dalam contoh kita di atas).

Anda tidak harus meletakkan semua JavaScripts Anda ke lokasi yang sama dengan dokumen halaman web HTML Anda. Anda mungkin ingin memasukkannya ke folder JavaScript terpisah. Dalam hal ini, Anda cukup mengubah nilai dalam src atribut untuk memasukkan lokasi file. Anda dapat menentukan alamat web relatif atau absolut apa pun untuk lokasi file sumber JavaScript.

Menggunakan Apa yang Anda Ketahui

Sekarang Anda dapat mengambil skrip apa pun yang telah Anda tulis atau skrip apa pun yang Anda peroleh dari pustaka skrip dan memindahkannya dari kode halaman web HTML ke file JavaScript yang dirujuk secara eksternal.

Anda kemudian dapat mengakses file skrip itu dari halaman web mana saja hanya dengan menambahkan tag skrip HTML yang sesuai yang memanggil file skrip itu.

instagram story viewer