前端学习之本地储存与cookie
今天主要的学习内容是cookie与本地储存的知识,
在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存在本地的,后者只是伴随着session,窗口一旦关闭就没了。二者用法完全相同,这里以localStorage为例。
if(window.localStorage){
alert('This browser supports localStorage');
}else{
alert('This browser does NOT support localStorage');
}
而读取、写、删除操作方法有很多方法,也很简单,但长用getItem()和setItem(),清除键值对使用removeItem()。如果希望一次性清除所有的键值对,可以使用clear()。
localStorage.setItem("user","abcd");
localStorage.setItem("user1","abcd1");
localStorage.removeItem("user");
在说说cookie。
cookie 是存储于访问者的计算机中的变量,用来存放一些数据。在我们浏览页面时,经常会填写自己的名字等,这些会被存放于cookie中。
学习cookie主要有3个函数,包括创建cookie,获取cookie中的值,删除cookie。
创建cookie:
function setcookie(name,value,iday){
var odate=new Date();
odate.setDate(odate.getDate()+iday);
document.cookie=name+"="+value+";expires="+odate;
}
获取cookie:
function setcookie(name){
var cookies=document.cookie;
var arr1=cookies.split("; ");
for (i=0;i<arr1.length;i++){
var arr2=arr1[i].split("=")
if(name==arr2[0]){
return arr2[1];
}
}
return false;
}
删除cookie:
function removecookie(name){
setcookie(name,"","-1") //通过建立cookie的时间设置,将时间设置为提前一天;
}
加油。。。明天会更好!!
前端学习之本地储存与cookie的更多相关文章
- Web前端学习第三天(cookie 二)
HttpOniy Cookie机制 在http层面传输cookie,当设置HttpOnly标志后,客户端脚本就无法读写该cookie.可以用此防止xss攻击获取cookie <?php setc ...
- HTML5中本地储存概念是什么,什么优点 ,与cookie有什么区别?
html5中的Web Storage 包括了两种存储方式: sessionStorage 和 localStorage. seessionStorage 用于本地存储一个会话(session)中的 ...
- web前端使用localstorage、sessionstorage、cookie增删获方法
今天主要的学习内容是cookie与本地储存的知识, 在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别, ...
- vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结
vue—你必须知道的 目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...
- 值得H5前端学习的60个JS插件(含DEMO演示)
下面也可以说是H5前端学习的js插件大全.基本包含了大部分的前端最前沿的js插件和库. 布局 SuperEmbed.js- 是一个Javascript库,可检测出网页上的内嵌视频并使他们能够变成响应式 ...
- 每天成长一点---WEB前端学习入门笔记
WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...
- 前端学习 第二弹: JavaScript中的一些函数与对象(1)
前端学习 第二弹: JavaScript中的一些函数与对象(1) 1.apply与call函数 每个函数都包含两个非继承而来的方法:apply()和call(). 他们的用途相同,都是在特定的作用域中 ...
- 【FE前端学习】第二阶段任务-基础
技能学习部分: 1.需要熟练掌握HTML标签以及CSS各个常用属性. 2.掌握CSS3 常用属性 3.掌握jquery的基本用法,对于JS基本逻辑语句需要熟练掌握 上文 [FE前端学习]第二阶段任务- ...
- Web前端学习笔记(001)
....编号 ........类别 ............条目 ................明细....................时间 一.Web前端学习笔记 ...
随机推荐
- Altium Designer15 卡在登陆界面解决办法:
Altium Designer15 卡在登陆界面解决办法: 在我的电脑系统盘中找到下面目录(注:如果看不到,需要取消隐藏文件选项.) C:\Documents and Settings\Adminis ...
- 谈谈Activiti中流程对象之间的关系
详细见:http://www.kafeitu.me/activiti/2012/03/22/workflow-activiti-action.html (咖啡兔好牛!) 详细见: http://blo ...
- task9暂存
<h6>第一组项目</h6> <div class="wrap"> <div class="title"> &l ...
- C#线程同步控制
ManualResetEvent类,用于通知一个或多个正在等待的线程已发生事件,它有2种状态:有信号(true)的无信号(false). 有2种方法可以设置它的信号状态:构造函数构造的时候设置或者通过 ...
- EXISTS语句
通常在我写EXISTS语句时,我会写成IF EXISTS(SELECT TOP(1) 1 FROM XXX),也没细细考究过为什么要这么写,只是隐约认为这样写没有啥问题,那今天就深究下吧! 首先准备测 ...
- Hibernate持久化类属性映射
Hibernate充当应用程序和数据库之间的中间件,实现二者之间的交互操作,他对JDBC进行了封装,以完全面向对象的方式来操作数据. 适用于有多个数据源的情况下,不必去考虑不同数据源的操作差异. Hi ...
- PHP读取Excel数据写入数据库(包含图片和文字)
public function test(){ $exts = 'xlsx'; //导入PHPExcel类库,因为PHPExcel没有用命名空间,只能inport导入 import("Org ...
- 关于onmouseover和onmouseout的bug
总结了一下关于使用onmouseover以及onmouseout会出现的bug 首先简单的布局: <div id="box"> <div>这是一个内容< ...
- asp.net程序集冲突解决笔记(未能加载文件或程序集"XXXXXXXXX")
先来看张截图.(未能加载文件或程序集”System.Web.Razor“) 先说一下我的情况.(扯蛋的,解决方法还在下面 —> _ < ) 这是 ASP.NET MVC 的东西.老大写了一 ...
- JSONP跨域的原理解析( 一种脚本注入行为)
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...