前端学习之本地储存与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前端学习笔记 ...
随机推荐
- oracle 脱敏和加密
脱敏:在此只是对数据如姓名,身份证号码等进行简单粗暴的脱敏,即改变数据 针对于number类型的数据:update table_name set conlunm_name = substr (co ...
- 安装好grunt,cmd 提示"grunt不是内部或外部命令" 怎么办?
Grunt和所有grunt插件都是基于nodejs来运行的,因此,必须安装node.js. (一) 去官网http://nodejs.org/ 下载安装包 node-v6.9.2.msi,直接点击安装 ...
- 技术英文单词贴--N
N normally 正常地,一般地
- 如何用java获得字符串的ASCII值
使用Integer.valueOf就可以直接将char类型的数据转为十进制数据表现形式. int value=Integer.valueOf('1');//49int value=Integer.va ...
- Window Server 2012 R2 下 IE11 浏览器 无法安装Flash 怎么解决
不知道是不是我这个的系统的问题,不仅仅是图片有问题,Flash也有问题.用IE打开页面,一直提示安装,简直不胜其烦.尽管我有下载很多浏览器,但习惯了IE,所以也没想用其他浏览器代替IE. 刚开始我是点 ...
- mysql定时器Events
MySQL定时器Events 一.背景 我们MySQL的表A的数据量已经达到1.6亿,由于一些历史原因,需要把表A的数据转移到一个新表B,但是因为这是线上产品,所以宕机时间需要尽量的短,在不影响数据持 ...
- Spring ioc容器
一.ioc容器 ioc (inversion of control)即控制反转,把某一个接口选择实现类的控制权转移给Spring容器来管理.调用类对该实现类的依赖关系由ioc容器注入(DI),传统的 ...
- brew 任何命令 都 报 synatx error
brew 忽然不能用了,任何命令都报 syntax error near unexpected token `<<<' 解决方案 cd $(brew --prefix) git fe ...
- Bootstrap插件系列——Bootstrap-table初始化、分页、客户端搜索、服务端搜索
又好久不写博客,最近项目都是用的bootstrap的样式,不出意外,应该是要在bootstrap的道路上越走越远了,所以下定决心,把bootstrap的插件都好好学学. 昨天写了boostrap-ta ...
- 进阶版css的点滴
-moz-:firefox: -webkit- Safari 和 Chrome