Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Apakah dua kaedah penyimpanan html5

Apakah dua kaedah penyimpanan html5

青灯夜游
Lepaskan: 2022-01-23 17:36:24
asal
2401 orang telah melayarinya

Dua kaedah penyimpanan HTML5 ialah: 1. Cache aplikasi (cache aplikasi), aplikasi web boleh dicache dan boleh digunakan walaupun tanpa rangkaian 2. Storan tempatan (localStorage atau sessionStorage), Data boleh disimpan di sebelah pelanggan.

Apakah dua kaedah penyimpanan html5

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi HTML5, komputer Dell G3.

1.Cache Aplikasi

HTML5 memperkenalkan cache aplikasi, yang bermaksud bahawa aplikasi web boleh dicache dan boleh digunakan walaupun tanpa rangkaian.

Cache aplikasi mempunyai tiga ciri

  • Menyemak imbas luar talian
  • Sumber cache dimuatkan lebih cepat
  • Kurangkan pelayan memuatkan, penyemak imbas hanya akan memuat turun sumber yang dikemas kini atau diubah daripada pelayan

Kaedah penggunaan ialah menambah atribut manifes dalam teg html

Setiap manifes yang ditentukan Halaman akan dicache apabila pengguna melawati mereka. Jika atribut manifes tidak ditentukan, halaman itu tidak akan dicache (melainkan ia dinyatakan secara langsung dalam fail manifes).

Sambungan fail yang disyorkan untuk fail manifes ialah: ".appcache".

<!DOCTYPE HTML>
<html manifest="demo.appcache">

<body>
The content of the document......
</body>

</html>
Salin selepas log masuk

Fail manifes ialah fail teks ringkas yang memberitahu penyemak imbas perkara yang dicache (dan perkara yang tidak dicache).

Fail manifes boleh dibahagikan kepada tiga bahagian:

  • MANIFEST CACHE - fail yang disenaraikan di bawah tajuk ini akan dicache selepas muat turun pertama
  • RANGKAIAN - dalam Fail disenaraikan di bawah tajuk ini memerlukan sambungan ke pelayan dan tidak akan dicache
  • FALLBACK - Fail yang disenaraikan di bawah tajuk ini menentukan halaman sandaran (seperti halaman 404) apabila halaman itu tidak boleh diakses

Fail manifes lengkap

CACHE MANIFEST  
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js

NETWORK:
login.asp

FALLBACK:
/html5/ /404.html
Salin selepas log masuk

2 Storan setempat

HTML5 menyediakan dua cara baharu untuk menyimpan data pada klien:

  • localStorage - storan data tanpa had masa
  • sessionStorage - storan data untuk sesi

Sebelum ini, ini semua dilakukan oleh kuki. Tetapi kuki tidak sesuai untuk menyimpan sejumlah besar data kerana ia dihantar dengan setiap permintaan kepada pelayan, yang menjadikan kuki lambat dan tidak cekap.

Kedua-dua localStorage dan sessionStorage mempunyai kaedah operasi yang sama, seperti setItem(), getItem() dan removeItem(), dll.
Kaedah localStorage dan sessionStorage:

setItem menyimpan nilai
Tujuan: Simpan nilai ke dalam medan kunci
Penggunaan: .setItem(kunci, nilai)
Contoh kod:

sessionStorage.setItem("key", "value");
localStorage.setItem("site", "js8.in");
Salin selepas log masuk

getItem untuk mendapatkan nilai
Tujuan: Dapatkan nilai disimpan secara setempat untuk kunci yang ditentukan
Penggunaan: .getItem(key)
Contoh kod:

var value = sessionStorage.getItem("key"); 
var site = localStorage.getItem("site");
Salin selepas log masuk

removeItem delete key
Penggunaan: padamkan nilai yang disimpan setempat bagi kunci yang ditentukan
Penggunaan: .removeItem(key)
Contoh kod:

sessionStorage.removeItem("key"); 
localStorage.removeItem("site");
Salin selepas log masuk

kosongkan bersih semua kunci/nilai
Penggunaan: kosongkan semua kunci/nilai
Penggunaan: .clear()

sessionStorage bukan storan berterusan dan akan dipadamkan selepas penyemak imbas ditutup. LocalStorage digunakan untuk storan tempatan yang berterusan Melainkan data dipadamkan secara aktif, data tidak akan luput.

Pengesyoran berkaitan: "tutorial video html"

Atas ialah kandungan terperinci Apakah dua kaedah penyimpanan html5. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:cnblogs.com
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan