<body>
<script>
// console.log(localStorage);
// console.log(typeof localStorage);
// 保存数据
// 2种实现方法
// 保存数据：localStorage.setItem(key,value);
localStorage.setItem('tel',1234567891);
localStorage.setItem('email',"xiao@163.com");
localStorage.setItem('todolist',{title:'平凡的世界',done:false});
// 在这个对象localStorage添加属性，向属性上赋值
localStorage.username ='小李';
localStorage.age = 19;
localStorage.sex = '男';
localStorage.tel = 15278493309;
localStorage.email = 'xiao@163.com';
// 读取数据：localStorage.getItem(key);
var uname = localStorage.getItem('username');
var age = localStorage.getItem('age');
var tel= localStorage.getItem('tel');
var email= localStorage.getItem('email');
console.log(uname);
console.log(age);
console.log(tel);
console.log(email);
// 删除单个数据：localStorage.removeItem(key);
localStorage.removeItem('sex');
// 删除所有数据：localStorage.clear();
// 在控制台中 查看 localStorage 是否有数据 如果length是0，代表没有数据
// localStorage.clear();
console.log(localStorage);
// 获取得到某个索引的key：localStorage.key(index);
console.log(localStorage);
// 通过索引，我们可以拿到对应的key
// 要想实现这个效果，就要把删除所有数据解除应用
var k0 = localStorage.key(0);
console.log(k0);
var k3 = localStorage.key(3);
console.log(k3);
var k2 = localStorage.key(2);
console.log(k2);
</script>
</body>
<body>
<script>
localStorage.setItem('num1',100);
localStorage.setItem('num2',100);
var num1 = localStorage.getItem('num1');
console.log(num1, typeof num1);
var num2 = localStorage.getItem('num2');
console.log(num2,typeof num2);
var sum = Number(num1) + Number(num2);
console.log(sum);
</script>
</body>
<style>
.box{
width: 500px;
margin: 50px auto;
}
</style>
</head>
<body>
<div class="box">
<label for="mysearch">搜索 </label>
<input type="text" id="mysearch" value="">
<br>
<h1 id="r"></h1>
</div>
<script>
// 表单中输入框中输入的内容自动存入localStorage中，并在刷新页面后显示出来。
// 抓取元素
var mysearch = document.querySelector('#mysearch')
console.log(mysearch);
var r =document.querySelector('#r');
console.log(r);
mysearch.onchange = function(){
// 保存数据
localStorage.setItem('mysearch',this.value);
}
// console.log(localStorage);
// 读取数据
window.onload =function(){
var mys =localStorage.getItem('mysearch');
// 向h1标题1标签中放置内容
r.innerHTML = mys;
}
</script>
</body>
1678
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
