前端学习之本地储存与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前端学习笔记 ...
随机推荐
- 何为babel / gulp
Babel主要用来将新版本的javascript(ES6,ES7)编译为ES5,目前它对于新标准的支持程度甚至高于Chrome浏览器.通过引入预设babel-preset-react,babel还能解 ...
- Spring Framework------>version4.3.5.RELAESE----->Reference Documentation学习心得----->使用spring framework的IoC容器功能----->方法一:使用XML文件定义beans之间的依赖注入关系
XML-based configuration metadata(使用XML文件定义beans之间的依赖注入关系) 第一部分 编程思路概述 step1,在XML文件中定义各个bean之间的依赖关系. ...
- $.each与$().each
在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法.两个方法是有区别的,从而这两个方法在针对不同的操作上,显示了各自的特点. $().each,对于这个方法,在d ...
- ABAP 读取EXCEL文件到内表
1.选择excel文件: PARAMETERS: P_FILE LIKE RLGRAP-FILENAME OBLIGATORY. AT SELECTION-SCREEN ON VALUE-REQUES ...
- sql删除前导和后缀
1.patindex用法 patindex('%pattern%', expression) pattern--> 正则表达式,需要匹配的前导内容,可以进通配: expression--> ...
- Android中脱离WebView使用WebSocket实现群聊和推送功能
WebSocket是Web2.0时代的新产物,用于弥补HTTP协议的某些不足,不过他们之间真实的关系是兄弟关系,都是对socket的进一步封装,其目前最直观的表现就是服务器推送和聊天功能.更多知识参考 ...
- PHP标准注释
"php是一门及其容易入门的语言,刚入门的新手不到几分钟的时间可能就会用echo打印出一个hello world !但是他是真正的程序员吗?怎么来定义程序员呢?如果想真正成为一个程序员,那么 ...
- Java getResourceAsStream() 方法会缓存文件的问题
xxx.getClass().getClassLoader().getResourceAsStream("d:/test-config.properties") 这方法确实会缓存文 ...
- 阻塞非阻塞,同步异步四种I/O方式
举一个去书店买书的例子吧: (同步)阻塞: 你去书店买书,到柜台告诉店员,需要买一本APUE,然后一直在柜台等.(阻塞) 店员拿到书以后交给你. (同步)非阻塞: 你去书店买书,到柜台告诉店员A,需要 ...
- Python 变量范围
1.本地变量,全局变量 Python 中有2种变量作用范围本地变量,全局变量. 变量搜索路径是:本地变量->全局变量 它们简而言之就是本地变量的值只在本地作用范围有效.而全局变量的作用范围是全局 ...