第十七节 Cookie基础与应用
什么是cookie：其实就是页面用来保存信息：比如，自动登录、记住用户名
cookie的特性：（以域名为单位的）
同一个网站（同一个域名）中所有页面共享一套cookie
数量、大小有限，跟浏览器有关，数量一般不超过50条，大小一般在4K-10K不等
有过期时间，什么时候过期，这个时间是由程序员设定的，如有些登录窗口会有“复选框：两周内自定登录”
JS中使用cookie，其实cookie只是document下面的一个属性，即document.cookie，如下cookie的使用
其中在“火狐”浏览器下，我们可在登录页面“右击空白”——查看页面信息——查看cookie——
设置cookie
① 格式：名字=值
② 设置多个cookie不会被覆盖，但是当我们设置的cookie名字相同时，后者的内容会把前面设置的内容覆盖掉
③ 过期时间：expires=时间，不设置时间时，浏览器关闭后，cookie就没了，其中expires表示有效期限，失效日期
日期对象的使用
<script>
//日期对象的使用
var oDate = new Date(); // oDate.setDate(29); //设置“日”，因为现在为2019年2月，只有28天，所以返回“2019-3-1”
//我们可以用上述方法给cookie添加过期时间，加入我们想让它两周以后过期则如下：
oDate.setDate(oDate.getDate()+14);
// alert(oDate.getFullYear()+'-'+(oDate.getMonth()+1)+'-'+(oDate.getDate()));
document.cookie = 'user=haha; expires='+oDate; //其中 expires='+oDate 这部分内容并不会出现在弹出的窗口里 // document.cookie = 'user=haha'; //此时“=”不表示赋值，而表示添加
// document.cookie = 'password=123456'; //所以本句内容并不会把上面一句覆盖掉
alert(document.cookie);
</script>
把cookie封装成函数，方便之后使用：
//把cookie封装成函数
function setCookie(name, value, iDay) {
var oDate=new Date();
oDate.setDate(oDate.getDate()+iDay);
document.cookie=name+'='+value+';expires='+oDate;
}
setCookie('username', 'hahha', 365);
读取cookie：字符串分割
function getCookie(name) {
var arr = document.cookie.split('; '); //cookie的字段之间用“; ”分割开
for (var i = 0; i < arr.length; i++) {
var arr2 = arr[i].split('=');
if (arr2[0] == name) {
return arr2[1];
}
}
return '';
}
alert(getCookie('username')); //返回hahha，匹配成功，正确输出
删除cookie：已经过期的cookie自动删除
//删除cookie
function removeCookie(name) {
setCookie(name, 1, -1);
}
removeCookie('user');
应用实例：
用cookie记录上次登录的用户名
提交时——记录用户名
window.onload——读取用户名
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>记住上一次登录的用户名</title>
<script>
//用户登录时，把用户名存进cookie，页面onload加载时读取“用户名”
window.onload = function () {
var oForm = document.getElementById('form_1');
var oUser = document.getElementsByName('user')[0]; //用户登录时，把用户名存进cookie
oForm.onsubmit = function () {
setCookie('user', oUser.value, 14); //14天后过期
}; //页面onload加载时读取“用户名”
oUser.value = getCookie('user');
}; //把cookie封装成函数
function setCookie(name, value, iDay) {
var oDate=new Date();
oDate.setDate(oDate.getDate()+iDay);
document.cookie=name+'='+value+';expires='+oDate;
}
// setCookie('username', 'hahha', 365);
// alert(document.cookie); //读取cookie
function getCookie(name) {
var arr = document.cookie.split('; '); //cookie的字段之间用“; ”分割开 for (var i = 0; i < arr.length; i++) {
var arr2 = arr[i].split('='); if (arr2[0] == name) {
return arr2[1];
}
}
return '';
}
// alert(getCookie('username')); //删除cookie
function removeCookie(name) {
setCookie(name, 1, -1);
}
</script>
</head>
<body>
<form id="form_1" action="http://www.baidu.com/">
用户名：<input type="text" name="user"/><br/>
密码：<input type="password" name="pass"/><br/>
<input type="submit" value="登录"/>
</form>
</body>
</html>
第十七节 Cookie基础与应用的更多相关文章
- 第三百二十七节，web爬虫讲解2—urllib库爬虫—基础使用—超时设置—自动模拟http请求
第三百二十七节,web爬虫讲解2—urllib库爬虫 利用python系统自带的urllib库写简单爬虫 urlopen()获取一个URL的html源码read()读出html源码内容decode(& ...
- 第4章 基础知识进阶 第4.1节 Python基础概念之迭代、可迭代对象、迭代器
第四章 基础知识进阶第十七节 迭代.可迭代对象.迭代器 一. 引言 本来计划讲完元组和字典后就讲列表解析和字典解析,但要理解列表解析和字典解析,就需要掌握Python的高级的类型迭代器,因此本节 ...
- 第一百二十七节，JavaScript，JSON数据类型转换，数据转换成字符串，字符串转换成数据
第一百二十七节,JavaScript,JSON数据类型转换,数据转换成字符串,字符串转换成数据 学习要点: 1.JSON语法 2.解析和序列化 前两章我们探讨了XML的结构化数据,但开发人员还是觉得这 ...
- 第三百九十七节，Django+Xadmin打造上线标准的在线教育平台—其他插件使用说，主题本地化设置
第三百九十七节,Django+Xadmin打造上线标准的在线教育平台—其他插件使用说,主题本地化设置 主题设置是在xadmin\plugins\themes.py这个文件 默认xadmin是通过下面这 ...
- 第三百八十七节，Django+Xadmin打造上线标准的在线教育平台—网站上传资源的配置与显示
第三百八十七节,Django+Xadmin打造上线标准的在线教育平台—网站上传资源的配置与显示 首先了解一下static静态文件与上传资源的区别,static静态文件里面一般防止的我们网站样式的文件, ...
- 第三百七十七节，Django+Xadmin打造上线标准的在线教育平台—apps目录建立，以及数据表生成
第三百七十七节,Django+Xadmin打造上线标准的在线教育平台—apps目录建立,以及数据表生成 apps目录建立 我们创建一个apps目录,将所有的app放到apps目录里去,这样方便管理,也 ...
- 第三百六十七节，Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)scrapy写入数据到elasticsearch中
第三百六十七节,Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)scrapy写入数据到elasticsearch中 前面我们讲到的elasticsearch( ...
- 第三百五十七节，Python分布式爬虫打造搜索引擎Scrapy精讲—利用开源的scrapy-redis编写分布式爬虫代码
第三百五十七节,Python分布式爬虫打造搜索引擎Scrapy精讲—利用开源的scrapy-redis编写分布式爬虫代码 scrapy-redis是一个可以scrapy结合redis搭建分布式爬虫的开 ...
- 第三百四十七节，Python分布式爬虫打造搜索引擎Scrapy精讲—通过downloadmiddleware中间件全局随机更换user-agent浏览器用户代理
第三百四十七节,Python分布式爬虫打造搜索引擎Scrapy精讲—通过downloadmiddleware随机更换user-agent浏览器用户代理 downloadmiddleware介绍中间件是 ...
随机推荐
- 使用Java客户端操作elasticsearch（二）
承接上文,使用Java客户端操作elasticsearch,本文主要介绍 常见的配置 和Sniffer(集群探测) 的使用. 常见的配置 前面已介绍过,RestClientBuilder支持同时提供一 ...
- 如何设置记事本( .txt文件)的默认编码为UTF-8?
1.在桌面新建一个文本文档,不要写入任何内容,然后手动另存为,将此文档编码改为UTF-8,然后将文件名字改为template.txt: 2.再将template.txt移动到C:\Windows\Sh ...
- css----transition的应用，产生动画效果。
应用transition属性产生动画效果 css中的transition属性设置元素的变化过程所需的时间. <!DOCTYPE html> <html> <head> ...
- LeetCode 34 - 在排序数组中查找元素的第一个和最后一个位置 - [二分][lower_bound和upper_bound]
给定一个按照升序排列的整数数组 nums,和一个目标值 target.找出给定目标值在数组中的开始位置和结束位置. 你的算法时间复杂度必须是 O(log n) 级别. 如果数组中不存在目标值,返回 [ ...
- mvc模式的理解
一开始总是觉得dao层和service层没有区别,甚至觉得service层根本就是多余的,service层就是把dao层的内容调用了一下,然后重写了一次,后来才理解到,dao层是数据链路层,是与数据库 ...
- CGI的工作原理
文章摘自https://blog.csdn.net/nyist327/article/details/41049699 CGI是Web服务器和外部程序之间的一个接口.利用CGI程序可以处理从Web上客 ...
- StarUML[3.1.0]官方安装破解版[app.asar]
StarUml 3.1.0 自注册破解版 安装完毕在注册界面随便输入一个 License 即可. 安装包方式可以选择从官方下,如果下载过慢,也可以选择分享包中的原版安装文件: 不放心的可以去校验MD5 ...
- [strongswan] strongswan是如何实现与xfrm之间的trap机制的
目录 strongswan与xfrm之间的trap机制 0. 1. 前言 2. 描述 2.1 none 2.2 trap 3. 实验与过程 3.1 trap实验 3.2 none实验 4 背景知识 5 ...
- MFC全屏显示和多窗口动态显示的一些技巧和方法
一.全屏 1.全屏窗口从dialogex继承,因为要处理一些东西 2.全屏代码,这样设置后尺寸不会出bug,只设置为最大值的话容易出bug //get current system resolutio ...
- MPLS的模拟学习过程
1.场景拓扑 使用小凡模拟器搭建了如下网络拓扑,使用的镜像为:c3640-jk9o3s-mz.122-15.T9.bin 相关的配置在下方 如果重复实验,需要清空设备的配置,知道路由器的密码,操作步骤 ...