【Html5每日练习】本地存储localStorage

最新推荐文章于 2022-12-21 21:51:28 发布

boia

最新推荐文章于 2022-12-21 21:51:28 发布

阅读量824

点赞数

分类专栏： Html5 文章标签： html5 存储 button function 浏览器 input

本文链接：https://blog.csdn.net/boiaprogramfan0420/article/details/7461429

版权

Html5 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

上一篇博文中讲到了sessionStorage，今天来练习一下localStorage，其实localStorage很简单，只要将对象改一下就行，看代码

<!DOCTYPE html>
<html lang="en-US">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<input type="text" class="text" id="text" />
<input type="button" value="保存数据" οnclick="setData();" />
<input type="button" value="获取数据" οnclick="getData();" />
  
<script>
	var dataArr = [];
	var ele = document.getElementsByClassName("text")[0];  //利用类选择器获得元素
	function setData()
	{
		var data = ele.value; 
		dataArr.push(data);
		if("" == data)
			alert("输入信息不能为空");
		else
		{
			localStorage.setItem("boia",dataArr);
			alert("信息已保存到date字段中");
		}
	}

	function getData()
	{
		var data = localStorage.getItem("boia");
		if("" == data || null == data)
			alert("无数据");
		else
			alert("保存的数据是:"+data);
	}
</script>  
</html>

localStorage和sessionStorage的区别就是数据是永久保存在硬盘里的，所以把浏览器关了的话，数据是不会没了的

boia

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【Html5每日练习】本地存储localStorage

上一篇博文中讲到了sessionStorage，今天来练习一下localStorage，其实localStorage很简单，只要将对象改一下就行，看代码 var dataArr = []; var ele = document.getElementsByClassName("text")[0]; //利用类选择器获得元素 function setData()
复制链接

扫一扫