首先，简单用js将cookie保存到浏览器中，具体可按F12在这里查看（火狐浏览器）

1、js脚本方法

1）添加cookie方法

      //添加cookie

    var addCookie = function (name, value, time) {

        var strSec = getSec(time);

        var exp = new Date();

        exp.setTime(exp.getTime() + strSec * 1);

        //设置cookie的名称、值、失效时间

        document.cookie = name + "=" + value + ";expires="+ exp.toGMTString();

    }

2）获取cookie方法

    //获取cookie

    var getCookie = function (name) {

        //获取当前所有cookie

        var strCookies = document.cookie;

        //截取变成cookie数组

        var array = strCookies.split(';');

        //循环每个cookie

        for (var i = 0; i < array.length; i++) {

            //将cookie截取成两部分

            var item = array[i].split("=");

            //判断cookie的name 是否相等

            if (item[0] == name) {

                return item[1];

            }

        }

        return null;

    }

3）删除cookie方法

   //删除cookie

    var delCookie = function (name) {

        var exp = new Date();

        exp.setTime(exp.getTime() - 1);

        //获取cookie是否存在

        var value = getCookie(name);

        if (value != null) {

            document.cookie = name + "=" + value + ";expires="+ exp.toUTCString();

        }

    }

4）计算cookie毫秒方法

    //获取时间的秒数（参数：d，h,m,s） 12m

    var getSec = function(str){

        var str1 = str.substr(0, str.length - 1);  //时间数值

        var str2 = str.substr(str.length-1, 1);    //时间单位

        if (str2 == "s") {

            return str1 * 1000;

        }

        else if (str2 == "m") {

            return str1 * 60 * 1000;

        }

        else if (str2 == "h") {

            return str1 * 60 * 60 * 1000;

        }

        else if (str2 == "d") {

            return str1 * 24 * 60 * 60 * 1000;

        }

    }

5）页面调用方法

var addCookieFun = function(){

        var cookie_key = document.getElementById("cookie_key").value;

        var cookie_val = document.getElementById("cookie_val").value;

        var cookie_time = document.getElementById("cookie_time").value;

        addCookie(cookie_key,cookie_val,cookie_time);

        alert("添加cookie："+ cookie_key);

    }

    var chkCookieFun = function(){

        var cookie_key = document.getElementById("cookie_key").value;

        var result = getCookie(cookie_key);

        if(result!=null){

            alert("存在cookie:"+ cookie_key);

        }else{

            alert("不存在cookie:"+cookie_key);

        }

    }

    var delCookieFun = function(){

        var cookie_key = document.getElementById("cookie_key").value;

        delCookie(cookie_key);

        alert("删除cookie："+ cookie_key);

    }

2、html界面如下

<body>

    <label>cookie名：</label><input id="cookie_key" type="text"  /> <br/>

    <label>cookie值：</label><input id="cookie_val" type="text"  /> <br/>

    <label>失效时间：</label><input id="cookie_time"  type="text" title="时间格式（10s,2m等）" /> <br/> <br/>

    <input type="button" value="添加cookie"  onClick ="addCookieFun()"/> &nbsp; &nbsp;

    <input type="button" value="检查cookie"  onClick ="chkCookieFun()"/>  &nbsp; &nbsp;

    <input type="button" value="删除cookie"  onClick ="delCookieFun()"/>  &nbsp; &nbsp;

</body>

3、效果图

1）运行效果

2）添加cookie

3) 检查cookie

当前浏览器的cookie失效时间

当前系统时间

注：由于GMT时间和北京时间相差8个时区，也就是说Wed Nov 21 2018 17:36:01 GMT+0800 (中国标准时间) 转换为GMT时间：Wed Nov 21 2018 09:36:01 GMT（格林威治时间），

由于我创建cookie的失效时间是Wed, 21 Nov 2018 09:29:01 GMT（2018-11-21 17:29:01） 比当前时间 （2018-11-21-17:36）小，已经失效，所以该cookie不存在。

4) 删除cookie

添加一个新的cookie

点击删除后

Ps：

cookie的添加以文本框参数为主（key,value,time）, 获取cookie和删除cookie以文本框参数（key）就可以执行了

js如何在浏览器添加cookie（添加、获取、删除）的更多相关文章

  1. js/java 获取、添加、修改、删除cookie（最全）

      一.cookie介绍 1.cookie的本来面目 HTTP协议本身是无状态的.什么是无状态呢,即服务器无法判断用户身份.Cookie实际上是一小段的文本信息(key-value格式).客户端向服务 ...

  2. selenium webdriver 如何添加cookie

    一. webdriver中常用的cookie方法 webdriver中提供了操作cookie的相关方法: get_cookies()                  获得cookie信息 add_c ...

  3. selenium webdriver如何添加cookie

    一. webdriver中常用的cookie方法 webdriver中提供了操作cookie的相关方法: get_cookies()                  获得cookie信息 add_c ...

  4. Js添加、读取、删除cookie，判断cookie是否有效，指定domain域下主路径path下设置cookie，设置expires过期时间

    有时我们需要用cookie保存用户名,记录登录状态,如何正确判断该机用户cookie是否存在呢?不能简单使用a!=”这样的写法. 正确方法是:判断是否存在名为username3的cookie,使用do ...

  5. jmeter-登录获取cookie后参数化，或手动添加cookie， 再进行并发测试

    以下情况其实并不适用于直接登录可以获取cookie情况,直接可以登录成功,直接添加cookie管理,cookie可以直接使用用于以下请求操作. 如果登录一次后,后续许多操作,可以将cookie管理器放 ...

  6. 把cookie以json形式返回，用js来set cookie.（解决手机浏览器未知情况下获取不到cookie）

    .继上一篇随笔,链接点我,解决手机端cookie的问题. .上次用cookie+redis实现了session,并且手机浏览器可能回传cookies有问题,所以最后用js取出cookie跟在请求的ur ...

  7. katalon系列十五：给浏览器添加cookie自动登陆

    import org.openqa.selenium.Cookieimport org.openqa.selenium.WebDriverimport com.kms.katalon.core.web ...

  8. ASP.NET购物车Cookie获取，创建，添加，更新，删除的用法

    #region 添加购物车 public void GetShoppingCart(int skuId, int quanlity) { HttpCookie cookie = HttpContext ...

  9. selenium常用操作，查找元素，操作Cookie，获取截图，获取窗口信息，切换，执行js代码

    目录: 1. 常用操作 2. 查找元素 3. 操作Cookie 4. 获取截图 5. 获取窗口信息 6. 切换 7. 执行JS代码 简介 selenium.webdriver.remote.webdr ...

随机推荐

  1. Centos使用natapp教程

    官网:https://natapp.cn/ 首先在Natapp站注册账号 点击注册 登录后,点击左边 购买隧道,免费/付费均可 根据需要选择隧道协议,这里以web演示,购买隧道 在 https://n ...

  2. python函数默认参数作用域

    当def函数参数默认值为对象时,例如列表[],字典{} 示例1:猜测一下,会输出什么??? def ddd(a,b=[]): b.append(a) return b print(ddd(1)) pr ...

  3. windows下cmd无法使用telnet命令解决方法 (原)

    telnet不是内部或者外部命令,也不是可运行程序-----解决办法: (win7为例) 控制面板 --- > 程序(小图标下直接到[程序和功能]) --- >程序和功能 --- > ...

  4. [macOS] Cannot find libz when install php56

    After upgraded to 10.12 and xcode8.2, when updating php with homebrew, i got these errors: /usr/loca ...

  5. linux终端使用ss代理

    title: linux终端使用ss代理 date: 2017-11-09 21:06:16 tags: linux categories: linux 系统为archlinux 先将ss代理转化为h ...

  6. CentOS 7 DR模式LVS搭建

    调度器LB : 192.168.94.11 真实web服务器1 : 192.168.94.22 真实web服务器2 : 192.168.94.33 VIP : 192.168.94.111 脚本如下 ...

  7. arcgis 制图-插值图

    1.生成插值图 插值工具: 方案1:Spatial Analyst 工具-->插值分析-->反距离权重法 (IDW) + Spatial Analyst 工具-->提取分析--> ...

  8. Python+OpenCV图像处理（十六）—— 轮廓发现

    简介:轮廓发现是基于图像边缘提取的基础寻找对象轮廓的方法,所以边缘提取的阈值选定会影响最终轮廓发现结果. 代码如下: import cv2 as cv import numpy as np def c ...

  9. MVC输出缓存(OutputCache参数详解）

    版权声明:本文为博主原创文章,未经博主允许转载随意. https://blog.csdn.net/kebi007/article/details/59199115 1.学习之前你应该知道这些 几乎每个 ...

  10. Python云图——WordCloud了解一下

    字符可以作画(参考前文:使用记事本画出照片) 字符串一样也可以 安装词云WordCloud. pip install wordcloud 编写要生成词云的内容字符串 保存为txt格式就可以了 使用Py ...