localStorage特点:关闭浏览器 记录还是有的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>localStorage</title>
</head>
<body>
<!--
特点:关闭浏览器 记录还是有的
-->
<h2>localStorage</h2>
<button onclick="saveData()">点我保存一个数据</button>
<button onclick="readData()">点我读取一个数据</button>
<button onclick="deleteData()">点我保存一个数据</button>
<button onclick="deleteAllData()">点我清空数据</button>
<script>
let p = {name:'张三',age:18}
function saveData(){
//setItem方法 本地存储 参数都必须为字符串 如果不是会默认toString 把一个对象转换会字符串 方法是JSON.stringify()
localStorage.setItem('msg','hello!!!')
localStorage.setItem('person',JSON.stringify(P))
}
function readData(){
console.log(localStorage.getItem('msg'));
const result = localStorage.getItem('person')
//JSON.parse方法是解析转换的对象
console.log(JSON.parse(result));
}
function deleteData(){
//remove方法是移除某个
localStorage.removeItem('msg2')
}
function deleteAllData(){
localStorage.clear()
}
</script>
</body>
</html>
sessionStorage特点:关闭浏览器 记录就没有了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>sessionStorage</title>
</head>
<body>
<!--
特点:关闭浏览器 记录就没有了
-->
<h2>sessionStorage</h2>
<button onclick="saveData()">点我保存一个数据</button>
<button onclick="readData()">点我读取一个数据</button>
<button onclick="deleteData()">点我保存一个数据</button>
<button onclick="deleteAllData()">点我清空数据</button>
<script>
let p = {name:'张三',age:18}
function saveData(){
//setItem方法 本地存储 参数都必须为字符串 如果不是会默认toString 把一个对象转换会字符串 方法是JSON.stringify()
sessionStorage.setItem('msg','hello!!!')
sessionStorage.setItem('person',JSON.stringify(P))
}
function readData(){
console.log(sessionStorage.getItem('msg'));
const result = sessionStorage.getItem('person')
//JSON.parse方法是解析转换的对象
console.log(JSON.parse(result));
}
function deleteData(){
//remove方法是移除某个
sessionStorage.removeItem('msg2')
}
function deleteAllData(){
sessionStorage.clear()
}
</script>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/163330.html