提示：
本文为JavaScript栏目：jQuery高级学习：前后端分离02——传统数据交互模式
前言
传统方式的数据交互
A.HTML
<body>
<div id="app">
<div id="detail">
<button type="button" id="min">-</button>
<input type="text" value="0" id="count">
<button type="button" id="plus">+</button>
<a href="B.html?count=5&id=2">购物车</a>
</div>
</div>
<script>
document.getElementById("plus").onclick=function () {
let value=parseInt(document.getElementById("count").value);
value++;
document.getElementById("count").value=value;
optStroe(value);
}
document.getElementById("min").onclick=function () {
let value=document.getElementById("count").value;
if (value>0){
value--;
}
document.getElementById("count").value=value;
optStroe(value);
}
function optStroe(nowValue) {
localStorage.setItem("count",nowValue)
}
window.onload=function () {
let count=localStorage.getItem("count")||0;
document.querySelector("#count").value=count;
}
</script>
</body>
B.html
<div id="app">
<p>您一共购买了<b>0</b>件商品</p>
</div>
</body>
<script>
let count=localStorage.getItem("count")||0;
document.querySelector("b").innerText=count;
</script>
扫一扫
1209
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
