前端学习之本地储存与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 正则表达式
1.获取不包含 欧洲|*北美|*中国|*欧拉非 字符串的行. SELECT/* count(*)*/* FROM table t WHERE NOT regexp_like(t.xxxx, '( ...
- Java 零基础之作业小练习
[练习1] 需求:输入学员的名称及总科目数并显示每项科目成绩的分数,算出总成绩. package demo2; import java.util.Scanner; //先import Scanner语 ...
- 使用miniui框架制作树形节点
<div id="leftTree" class="mini-outlooktree" url="<%=basePath%>mana ...
- extern关键字
1.extern "C" void func(){...} extern可以置于变量或者函数前,以标示变量或者函数的定义在别的文件中,提示编译器遇到此变量和函数时在其他模块中寻找其 ...
- javac 命令出现 找不到文件 问题及解决办法
如果环境配置好了,使用java -version回车可以正常查看到版本信息. 使用javac Demo.java 如果提示文件找不到 可能原因1: 源文件与当前命令行不在同目录下,这时候就要切换到同一 ...
- 第四十一章 微服务CICD(3)- jenkins + gitlab + webhooks + publish-over-ssh(1)
一.作用 使用webhooks来实现当git客户端push代码到gitlab后,jenkins会立即去gitlab拉取代码并构建. 二.步骤 1.安装插件 ruby_runtime(Hook插件依赖于 ...
- WEB中的GET和POST
客户端提交数据到服务器端有两种方式GET和POST,get是将数据拼接到url上,而post是将数据封装在request body中,发送过去.顾名思义,get即请求数据,有时需要其附带部分参数:po ...
- Ueditor1.4.3.3+springMvc+maven 实现图片上传
前记:由于项目中需要有一个新增数据并且要能支持表格图片上传的功能.使用了ueditor控件.为实现这个功能,从一开始什么都看不懂,到一直连着弄了5天,总算是有了眉目.在此记录一下以便能帮到可以和我一样 ...
- Centos 压缩、解压和打包命令
gzip命令 --功能说明:gz文件的压缩和解压缩. --命令格式:gzip [参数] <文件> --常用参数: -d 解开压缩文件 -l 列出压缩文件的相关信息 -q 不显示警告信息 - ...
- Myeclipse 安装离线adt的方法 ()
方法一: 1.下载最新的adt插件ADT-10.0.1.zip (在MyEclipse 10.5 上安装的ADT插件是ADT 20.0.3离线包下载地址: http://dl.cr173.com//s ...