缓存机制
缓存机制.jpeg
一个栗子
image.png
--Cache-Control: max-age=0 缓存 可是时效为0
--Cache-Control: no-cache 缓存 可是时效为0
--Cache-Control: no-store 不缓存
离线存储
--Session Storage：作用域只在一个会话中，也就是一个tap页中。关闭当前tap页，作用域随之消失
--Local Storage：作用域可在多个会话中，也就是多个tap页中，多个tap页可以共性数据。关闭tap页，作用域？
Session Storage的使用场景：表单回显
//在填写表单时，不小心刷新了页面不至于数据丢失。
<body>
<input type="text" id="text" />
</body>
<script>
window.onload = function(){
var text = document.querySelector("#text");
//在页面刷新后，将上次input的值显示到文本框中
var val = sessionStorage.getItem("val");
if(val){
text.value = val;
}
//input输入事件：将input中的值保存到sessionStorage中
text.addEventListener("input",function(){
sessionStorage.setItem("val",text.value);
})
}
</script>
Local Storage的使用场景：多个tap页共享数据
/*在购物时，打开了多个tap页，每个tap选择了不同的商品，
这时需要共享数据功能才能实现每个tap选择的商品是一致的状态*/
网友评论