day63—JavaScript浏览器对象cookie

转行学开发，代码100天——2018-05-18

今天的主要学内容时JavaScript中浏览器对象——cookie.

cookie用于存储web页面的用户信息，其存储容量很小，一般几k左右。如常见的网页中用户信息的保存基本上都是用cookie来实现的。

cookie的使用简单，以键值对形式存储信息，如

username=Allen

当用户访问页面时，填写用户信息时保存在cookie中，在用户下一次访问页面时，直接从cookie中获取用户信息并填写在用户信息栏中，以避免用户重复输入的步骤。

cookie的特点：

同一个网站所有页面共享一个cookie；
cookie容量很小；
可以为cookie添加过期时间。

下面具体说明一下cookie的创建，读取和删除用法。

1. cookie的创建

js中，cookie的调用：document.cookie

为cookie添加存储信息：

document.cookie ='username=allen';
document.cookie = 'password=123466';
alert(document.cookie);

这是可以发现username和password同时弹出，也就是说这里的赋值“=”相当于添加功能，即为cookie添加多个对象时，直接给cookie多次赋值即可。

但是当关闭页面，注释赋值信息，关闭后并没有弹出预期的内容，为什么呢？说好的会保存信息的。

原来，这里只是创建了cookie信息，要进行保存，还需要一步操作，即为cookie对象添加过期信息，如下

    var oDate = new Date();
        oDate.setDate(oDate.getDate()+14);//设置14天以后过期
        document.cookie ='username=allen ; expires='+oDate;
        document.cookie = 'password=123466;expires='+oDate;
        alert(document.cookie);

查看火狐浏览器网页时，可看到添加的username和password信息如下：

注释cookie信息后，刷新页面依然能弹出如下信息：

至此我们就知道如何创建cookie信息了。

2.cookie信息的读取

day63—JavaScript浏览器对象cookie

猜你喜欢