H5保存并读取临时文件

1:
错误:我运行的时候没有显示出数据
=============
在H5,APP中,本地存储主要用于客户端存储用户名等简单的用户信息
1:
分析
web Storage页面存储是H5为存储数据在客户端提供的一项重要功能,因为web Storage API可以区分会话数据和长期数据。
因此相应的API可以分为2两种类型
1:
sessionStorage:保存会话数据
2:
sessionStorage:在客户端长期保存数据
3:
使用sessionStorage对象保存数据的方法

调用setItem()方法
格式如下:
sessionStorage.setItem(key,value);
参数key表示被保存内容的键名
参数value表示被保存内容的键值
--
成功设置键名后不再允许修改,也不能重复,如果有重复,他就会取代原来的。
2:
读取被保存的数据getItem()方法
格式如下:
sessionStorage.getItem(key);
其中参数key表示设置保存时被保存内容的键名,该方法将返回一个指定键名对应的键值,如果不存在则返回一个null值
---------
案例:
创建一个文本框,和一个读取按钮,点击按钮,读取文本框的内容并且显示在页面
HTML代码
<fieldset>
<legend>读取数据</legend>
    <input name="txtName" type="text" class="inputtxt" onChange="txtName_change(this);"size="30px">
    <input name="btnGetValue" type="button" class="inputbtn" οnclick="btnGetValue_click();" value="读取">
    <p id="pStatus">5555</p>
</fieldset>
======================
js代码
<script type="text/javascript">
//获取id的函数
function $$(id){
return document.getElementById(id);
}
//输入文本框内容时调用的函数
function txtName_change(v){
var strName=v.value;//获取v的值,就是文本输入的值
sessionStroage.setItem("strName",strName);//键名和键值
$$("pStatus").style.display="block";
//$$("pStatus").innerHTML=sessionStorage.getItem("strName");//插入数据的时候,读取数据
$$("pStatus").innerHTML=sessionStorage.setItem("strName");
}
//点击读取按钮时调用的函数
function btnGetVaule_click(){
$$("pStatus").style.display="block";//会显示文本的样式
$$("pStatus").innerHTML=sessionStorage.getItem("strName");//,通过key值获取数据
}
</script>
==========
css代码
<style type="text/css">
.inputbtn{
border:#ccc 1px solid;
background-color:#eee;
line-height:18px;
font-size:12px;
}
.inputtxt{
border:#ccc 1px solid;
line-height:18px;
font-size:12px;
padding-left:3px;
}
fieldset{
padding:10px;
width:285px;
float:left;
}
#pStatus{
display:none;
border:#ccc 1px solid;
width:158px;
background-color:#eee;
padding:6px 12px 6px 12px;
margin-left:2px;
}
</style>
===========
解决bug:
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值