js cookie实例
什么是cookie:
△ 用来保存用户信息:用户名、密码... ...
△ 同一网站共享一套cookie,大小有限,保存时间
△ 使用document.cookie
cookie包含:
cookieName=cookieValue; 名字和值(用户名、密码...)
expires=expirationDateGMT; 过期时间
path=URLpath; 存储一个URL
domain=siteDomain; 存储一个阈值
设置cookie:
document.cookie="名字1=值1";
document.cookie="名字2=值2"; 单个设置,复合写法:
document.cookie="名字1=值1; 名字2=值2";
例子:设置过期时间
var expDate=new Date();
expDate.setDate(expDate.getDate()+需要延长的时间);
document.cookie="expires="+expDate.toUTCstring();
/*
先创建时间对象
设置过期时间=当前时间+延长时间
写入cookie中
时间对象参考书册http://www.w3school.com.cn/jsref/jsref_obj_date.asp
*/
封装三种常用cookie函数:
□ 设置cookie
function setCookie(name,value,iDay){ //名字 值 保存(延长)时间
var oDate=new Date();
oDate.setDate(oDate.getDate()+iDay);
document.cookie=name+'='+value+';expires='+oDay;
}
□ 获取cookie
function getCookie(name){
//"userName=abc; password=123; ..." cookie里的内容,字符串
var arr=document.cookie.split('; ');
var i=0;
//arr→["useName=abc";"password=123"...] 用split()切割成数组,仍不能直接使用
for(var i=0;i<arr.length;i++){
//arr2→["useName","abc"] 细分,可以调用
var arr2=arr.split(“=‘);
if(arr2[0]==name){ //条件成立时,返回对应值
return arr2[1];
}
return "'; //内容为空时,返回空
}
}
□ 删除cookie
function removeCookie(name){
setCookie(name,"value随便填",-1);
//保存时间为负数,意为已过期浏览器自动删除相关内容
}
相关实例:
① cookie记录拖拽位置
获取对象属性网址:http://www.w3school.com.cn/jsref/dom_obj_all.asp
②表单Form记住/清除用户名
【html】
<form action="" id=" ">
用户名:<input type="text" name="user" />
密码:<input type="password" name="pass" />
<input type='"submit" value="登陆" />
<a href="javacirpt:;">清除记录</a>
</form>
【js】
var oForm=document.getElementById(" "); //获取表单
var oUser=document.getElementByName("user")[0]; //获取用户名
var oBtnClear=document.getElementByTagName("a")[0]; //获取清除按钮
//当用户点击提交时执行
oForm.onsubmit=function(){
setCookie("user", oUser.value, 30); //设置
}
oUser.value=getCookie("user"); //把用户名显示在页面上
oBtnClear.onclick=function(){
removeCookie("user"); //清除cookie
oUser.value=" "; //把页面上的用户名也清除
}
-------------------------------------------------------------------------------------------------------------------------------------------------------
火狐查看cookie
1.若菜单栏隐藏,先调出
alt+f -- 查看-- 工具栏--菜单栏 (勾选)
2.工具--页面信息--安全--查看cookie
-------------------------------------------------------------------------------------------------------------------------------------------------------
资料来源:
官方cookie文档http://www.w3cschool.cc/js/js-cookies.html
js cookie实例的更多相关文章
- js cookie介绍和实例(用于自动登录,记住用户名等)
js cookie介绍和实例(用于自动登录,记住用户名等) 一.总结 1.cookie在客户端:因为js是最初是用来在客户端和服务器端进行通信使用的,所以客户端比如js可以操作cookie正常 2.c ...
- Python爬虫教程-16-破解js加密实例(有道在线翻译)
python爬虫教程-16-破解js加密实例(有道在线翻译) 在爬虫爬取网站的时候,经常遇到一些反爬虫技术,比如: 加cookie,身份验证UserAgent 图形验证,还有很难破解的滑动验证 js签 ...
- JS练习实例--编写经典小游戏俄罗斯方块
最近在学习JavaScript,想编一些实例练练手,之前编了个贪吃蛇,但是实现时没有注意使用面向对象的思想,实现起来也比较简单所以就不总结了,今天就总结下俄罗斯方块小游戏的思路和实现吧(需要下载代码也 ...
- js COOKIE 记住帐号或者uuid
当开始接到这个任务的时候,我对cookie还是没多少了解的,而uuid的生成也是一无所知.但是当你发现这个网址http://stackoverflow.com/questions/105034/how ...
- [JS]Cookie精通之路
[JS]Cookie精通之路 转http://blog.163.com/neu_pdh1983/blog/static/572407020077310528915/ 发布:Cary 媒体:www.Ju ...
- Node.js入门实例程序
在使用Node.js创建实际“Hello, World!”应用程序之前,让我们看看Node.js的应用程序的部分.Node.js应用程序由以下三个重要组成部分: 导入需要模块: 我们使用require ...
- JS Cookie丢失问题
JS Cookie丢失问题 前些天有人问我vue中使用proxy发送请求,为什么请求时cookie丢失,首先说一下我对cookie的理解: 1.cookie在正常情况下是会在每次请求时自动携带, 2. ...
- jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明
jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明 jquery.lazyload.js是一个用JavaScript编写的jQuery插件.它可以延迟加载长页面中的图片 ...
- jQuery懒加载插件jquery.lazyload.js使用说明实例
jQuery懒加载插件jquery.lazyload.js使用说明实例很多网站都会用到‘图片懒加载’这种方式对网站进行优化,即延迟加载图片或符合某些条件才开始加载图片.懒加载原理:浏览器会自动对页面中 ...
随机推荐
- poj-1251-最小生成树
title: poj-1251-最小生成树 date: 2018-11-20 16:38:14 tags: acm 刷题 categories: ACM-最小生成树 概述 前段时间数据结构的课上提到了 ...
- maven 发布jar包到远程仓库
有的时候我们需要发布一些自己写的相关jar包到maven私服,供项目组使用. 首先在setting.xml文件添加,这里 注意 要保证该账户有发布的权限 <servers> <ser ...
- iOS 11开发教程(十一)了解iOS11应用视图
iOS 11开发教程(十一)了解iOS11应用视图 在iPhone或者iPad中,用户看到的和摸到的都是视图.视图是用户界面的重要组成元素.本节将主要讲解视图的添加.删除以及位置和大小的设置等内容. ...
- luogu4770 [NOI2018]你的名字 后缀自动机 + 线段树合并
其实很水的一道题吧.... 题意是:每次给定一个串\(T\)以及\(l, r\),询问有多少个字符串\(s\)满足,\(s\)是\(T\)的子串,但不是\(S[l .. r]\)的子串 统计\(T\) ...
- 【Python3】【树形dp】uva10253 Series-Parallel Networks
设“共n个叶子,且每个非叶节点至少有两个子节点”的树的数量为f[n],再乘2就是本题答案. 设状态d(i,j)表示每棵子树最多包含i个叶子.一共有j个叶子的树的个数.于是f(n)=d(n-1,n).假 ...
- Windows Server 2008 R2的web服务器nginx和Apache的比较
因为很喜欢nginx,所以也想尝试在Windows下使用nginx,前面安装配置都挺顺利,把域名解析尽量后,通过域名代理访问jboss,却异常的慢,起码有3秒的时间才显示页面,而这个页面是jboss的 ...
- bzoj 1312 最大密度子图
晕,m=0是要输出1(弄的我还找管理员要数据,但明显题意是叫我们输出0呀) 最大密度子图,把边转换成点,然后二分答案,跑最大权闭合子图判定是否可行. #include <cstdio> # ...
- Nginx负载均衡的五种策略
nginx可以根据客户端IP进行负载均衡,在upstream里设置ip_hash,就可以针对同一个C类地址段中的客户端选择同一个后端服务器,除非那个后端服务器宕了才会换一个. nginx的upstre ...
- CHANGE USER WHEN I CONNECT TO TEAM FOUNDATION SERVER
Question: I USE TEAM EXPLORER TO CONECT TO TEAM FOUNDATION SERVER 2010, BUT I DO NOT LOGIN OUT, AND ...
- 【微信小程序】处理时间格式,时间戳转化展示时间格式问题,调用外部js的默认方法function的问题
默认的 小程序中new Date()显示的时间是这样的: 格式化时间的显示怎么做: 小程序的根目录下util目录下默认有一个util.js文件 其中util.js文件内容是: //数据转化 funct ...