JavaScript学习笔记

cookie介绍

cookie出现的原因:HTTP无状态协议,一旦数据传输完成(打开网页),
客户端与服务器端的链接立刻断开.如果需要再次通讯,需要重新连接.

cookie的使用原理:Cookie是一段文本信息,当客户端请求服务器,
如果服务器需要记录用户的状态信息,就可以为服务端发送一个cookie.
服务端就会把cookie存储起来,当再次请求时,服务端检查cookie以确认客户端的信息.

cookie的使用场景:

1.保存用户的登录状态(自动登录)
2.跟踪用户行为(记录信息)
3.网站定制
4.购物车(浏览过的商品)

cookie的弊端:

1.容量小   4k
2.条数限制,最多20条
3.cookie可以被删除
4.cookie的安全性
5.cookie是有存储期限的

cookie的使用

获取当前域名下的cookie,同一个网站的多个页面共用一个cookie

添加一条cookie

cookie添加的格式
以键值对的形式:key=value;
eg:document.cookie = "name = ime";
如果key之前没有出现过相当于添加
如果key之前出现过相当于修改value

多条cookie之间用分号隔开
如果没有设置cookie的期限,那么完全退出浏览器之后,cookie会被删除;真正保存cookie,需要设置期限.

方式1:设置cookie的失效日期,默认是当前时刻.

var expireDate = new Date();
expireDate.setDate(expireDate.getDate() + 1);
document.cookie="name=iwen;expireDate="+expireDate.toString();

方法2:设置存活的秒数

document.cookie = "gender=man;max-age=60";
document.cookie = "name=iwen";

如果同时设置了expires和max-age会怎么样?
答:会以max-age为准

删除一条cookie
设置时间期限让对应的键值对失效
max-age默认是当前时刻,值是-1

document.cookie = "name=;max-age=-1"

五个重要的练习函数

1.判断是否有对应name的cookie
2.取出key对应的value
3.写一个添加cookie的函数
4.写一个删除cookie函数
5.写一个清除所有cookie函数

模拟记住用户名和密码

记住用户名和密码的流程

1.点击登录,判断用户是否勾选记住用户名和密码框,
如果勾选,将用户名和密码存入cookie

2.再次打开网页时,判断cookie里是否有用户名和密码,
如果有,取出并显示在对应的文本框中