Cara menggunakan download html file javascript

Link pada HTML berfungsi untuk mengarahkan user/pengguna dari suaru halaman menuju halaman atau file lain. Link pada HTML adalah seperti berikut :

<a href=”https://www.webhozz.com”>Ini Link</a>

Keterangan :

a = anchor

href = Hypertext Reference

 

Sedangkan jika ingin agar saat link tersebut diklik maka kita bisa mendownload suatu file maka pertama tama arahkan href menuju ke suatu file. baik itu itu file, gambar, video atau apa saja yang ingin bisa di download. Setelah itu tambahkan atribut download pada link tsb. Kodenya bisa dilihat dibawah ini :

<a href=”/fptp/gambar_webhozz.jpg” download>Link download</a>

Seperti itulah cara untuk membuat link download dengan menggunakan html. Semoga bermanfaat.

 

Created By : Sanjaya Sapta

No related posts.

bagaimana membuat link downloadbikin link download dengan htmlcoding link download dengan htmlkode link download dengan htmlmembuat link download menggunakan html

Placing scripts at the bottom of the

document.write("Kode Javascript dari File Eksternal");
5 element improves the display speed, because script interpretation slows down the display.

Penulisan di akhir

document.write("Kode Javascript dari File Eksternal");
5 akan meningkatkan kecepatan display atau tampilnya konten di web.

Karena, jika kita tulis di dalam

document.write("Kode Javascript dari File Eksternal");
4, script tersebut akan dieksekusi terlebih dahulu sebelum konten ditampilkan.

Jadi, disarankan menulis kode Javascript di dalam

document.write("Kode Javascript dari File Eksternal");
5, tepatnya sebelum tutup
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
2.

2. Menulis Javascript pada File Eksternal

Cara kedua, kita bisa menulis Javascript di File yang terpisah dengan HTML.

Biasanya digunakan jika kita tidak ingin kode Javascript bercampur dengan kode HTML.

Bagaimana caranya?

Caranya, buatlah sebuah file yang berekstensi

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
3. File ini kita isi dengan kode Javascript.

Sebagai contoh, saya akan membuat file eksternal dengan nama

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
4 dan
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
5 sebagai kode HTML-nya.

Cara menggunakan download html file javascript

Berikut ini isi file

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
4 :

document.write("Kode Javascript dari File Eksternal");

Lalu isi

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
5 adalah sebagai berikut:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>

Hasilnya:

Cara menggunakan download html file javascript

Coba kamu perhatikan!

Pada kode HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
5, kita tetap menggunakan tag
document.write("Kode Javascript dari File Eksternal");
1. Akan tetapi, tag ini tidak kita isi dengan kode Javascript. Melainkan kita menggunakan atribut
<script src="kode-script.js">
0 untuk menggunakan kode Javascript yang ada di file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
4.

O ya, perlu diperhatikan juga:

Tag

document.write("Kode Javascript dari File Eksternal");
1 tetap harus ditutup dengan
<script src="kode-script.js">
3 walaupun tidak punya isi.

Salah: ❌

<script src="kode-script.js">

Benar: ✅

<script src="kode-script.js"></script>

Lalu gimana jika kode Javascript-nya berada di folder yang berbeda dengan dokumen HTML-nya?

Atau Javascriptnya berada di internet?

Itu gimana?

Untuk kode Javascript yang berada di folder yang berbeda, kita menulisnya mengikuti alamat path foldernya.

Misalnya struktur foldernya seperti ini:

Cara menggunakan download html file javascript

Karena file

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Penulisan Javascript</title>
</head>
<body>

    <script src="kode-script.js"></script>
</body>
</html>
4 berada di dalam folder
<script src="kode-script.js">
5, maka kita harus menulisnya:

<script src="js/kode-script.js"></script>

Giaman paham kan?

Nah, untuk kode Javascript yang diambil dari internet, kita cukup tuliskan alamat URL dari Javascript tersebut.

Contoh:

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

3. Menulis Javascript pada Atribut

Penulisan Javascript pada atribut bisanya dilakukan pada atribut event.

Contoh:

<button onclick="alert('Ok Terima kasih!')">Klik donk!</button>

Pada contoh ini, kita membuat elemen

<script src="kode-script.js">
6 dan memiliki attribut
<script src="kode-script.js">
7 yang berisi kode Javascript.

Nantinya, kode javascript yang ada di dalam atribut

<script src="kode-script.js">
7 akan dieksekusi saat event klik terjadi pada elemen
<script src="kode-script.js">
6.

Apakah Javascript hanya bisa ditulis pada atribut

<script src="kode-script.js">
7 saja?

Atribut

<script src="kode-script.js">
7 adalah salah satu atribut event yang ada di HTML, kode Javascript bisa ditulis di semua atribut event.

Ingat atribut event!

Bukan atribut biasa.

Jika kamu ingin lihat semua atribut event, silahkan cek di Event Reference.

Cara menggunakan download html file javascript

Penulisan atribut event di HTML diawali dengan

<script src="kode-script.js"></script>
2, misalnya untuk event
<script src="kode-script.js"></script>
3, maka pada atribut HTML ditulis
<script src="kode-script.js">
7.

Contoh lagi biar makin paham:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Penulisan Javascript di Atriibut</title>
</head>

<body>
    <textarea onkeyup="document.getElementById('counter').innerText = this.value.length" cols="30" rows="10"></textarea>
    <p>Panjang: <span id="counter">0</span> karakter</p>
</body>

</html>

Pada contoh ini, kita menggunakan event

<script src="kode-script.js"></script>
5, maka ditulis
<script src="kode-script.js"></script>
6. Event ini terjadi saat kita melepas tombol di keyboard.

Jadi nantinya saat kita mengetik pada elemen

<script src="kode-script.js"></script>
7, kode Javascript yang ada di
<script src="kode-script.js"></script>
6 akan dieksekusi.

Kode Javascript tersebut berfungsi untuk menampilkan jumlah karakter yang diketik.

Hasilnya:

4. Penulisan Javascript pada URL

Nah ini yang menurut saya cara yang cukup aneh.

Cara ini memang jarang digunakan dan hampir tidak ada yang menggunakannya di dalam aplikasi.

Tapi tetap bisa.

Caranya, pada URL kita gunakan

<script src="kode-script.js"></script>
9 lalu diikuti dengan kode Javascript yang ingin dieksekusi.

Contoh:

javascript:alert("Nah! ini Javascript")

Ini di ketik pada address bar browser.

Maka hasilnya:

Cara menggunakan download html file javascript

Catatan: Cara ini tidak bekerja di web browser versi terbaru, karena ini merupakan sebuah celah yang bisa dipakai untuk serangan XSS.

Lalu, bagaimana kita menggunakan cara ini di HTML?

Cara ini bisa kita gunakan pada tag

<script src="js/kode-script.js"></script>
0, lalu mengisinya di atribut
<script src="js/kode-script.js"></script>
1.

Contoh:

document.write("Kode Javascript dari File Eksternal");
0

Hasilnya:

Cara menggunakan download html file javascript

Jadi saat link

<script src="js/kode-script.js"></script>
0 diklik, ia akan membuka URL
<script src="kode-script.js"></script>
9 dan menjalankan kode Javascript yang ada di sana.

Bagaimana cara penggunaan JavaScript dalam HTML?

Anda bisa langsung menambahkan JavaScript di HTML dengan menggunakan tag <script></script> yang mencakup semua kode JS yang Anda tulis. Kode JS yang bisa ditambahkan: di antara tag <head> di antara <body>

Dimana kode JavaScript dapat ditempatkan dalam halaman HTML?

Posisi JavaScript di Dalam Tag <head> Umumnya, tag <script> diletakkan pada awal kode HTML di akhir tag <head>, atau di akhir tag <body>. Posisi peletakan ini akan mempengaruhi bagaimana urutan kode JavaScript berjalan. Halaman HTML di proses oleh web browser dari atas ke bawah secara berurutan.

Bagaimana membuat komentar di JavaScript?

Komentar multi line diawali dengan /* (garis miring bintang) dan diakhiri dengan */ (bintang garis miring). Kode atau teks apa pun yang berada diantara /* dan */ tidak akan dieksekusi oleh mesin.