首页 > 软件开发 > 编程语言 >

js如何设置cookie

来源:互联网 2023-03-17 00:14:48 573

JavaScript是运行在客户端的脚本,因此一般情况下是不能够设置Session的,因为Session是运行在服务器端的。而cookie是运行在客户端的,所以我们可以用JS来设置cookie。接下来请跟着小编一起来操作一下吧。Rlf办公区 - 实用经验教程分享!

工具/原料

  • 文本编辑器(用记事本即可)
  • 浏览器(测试用的)

准备及操作

  • 1

    首先说明一下我们是怎么做测试的,在AB两个页面中,我们在A页面写一个简单的登录界面,然后将登录信息写入cookie,然后在B页面读取cookie中的信息Rlf办公区 - 实用经验教程分享!

  • 2

    建立两个html文件分别为A.html和B.html,注意后缀名称Rlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 3

    在A.html里面写入的内容如下:Rlf办公区 - 实用经验教程分享!

    body>Rlf办公区 - 实用经验教程分享!

    请输入用户名和密码:Rlf办公区 - 实用经验教程分享!

    input id="userName" type="text" />input id="passwords" type="password" />input type="button" onclick="login()" value="登录"/>Rlf办公区 - 实用经验教程分享!

    script type="text/javaScript">Rlf办公区 - 实用经验教程分享!

    function login(){Rlf办公区 - 实用经验教程分享!

    // 获取用户名Rlf办公区 - 实用经验教程分享!

    var name = document.getElementById("userName");Rlf办公区 - 实用经验教程分享!

    // 获取密码Rlf办公区 - 实用经验教程分享!

    var pass = document.getElementById("passwords");Rlf办公区 - 实用经验教程分享!

    // 写入cookieRlf办公区 - 实用经验教程分享!

    setCookie("userName", name.value);Rlf办公区 - 实用经验教程分享!

    setCookie("passwords", pass.value);Rlf办公区 - 实用经验教程分享!

    // 跳转到B页面Rlf办公区 - 实用经验教程分享!

    window.location.href="B.html";Rlf办公区 - 实用经验教程分享!

    }Rlf办公区 - 实用经验教程分享!

    function setCookie(name,value){ Rlf办公区 - 实用经验教程分享!

    var Days = 30; //cookie 将被保存30天Rlf办公区 - 实用经验教程分享!

    var exp = new Date(); //获得当前时间Rlf办公区 - 实用经验教程分享!

    exp.setTime(exp.getTime() Days*24*60*60*1000); //换成毫秒Rlf办公区 - 实用经验教程分享!

    document.cookie = name "=" value ";expires=" exp.toGMTString();Rlf办公区 - 实用经验教程分享!

    } Rlf办公区 - 实用经验教程分享!

    /script>Rlf办公区 - 实用经验教程分享!

    /body>Rlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 3该信息未经许可获取自百度经验
  • 4

    在B.html写入的内容如下:Rlf办公区 - 实用经验教程分享!

    body>Rlf办公区 - 实用经验教程分享!

    获取到的用户名和密码为:Rlf办公区 - 实用经验教程分享!

    label id="mylabel">/label>Rlf办公区 - 实用经验教程分享!

    script type="text/javaScript">Rlf办公区 - 实用经验教程分享!

    var name = getCookie("userName");Rlf办公区 - 实用经验教程分享!

    var pass = getCookie("passwords");Rlf办公区 - 实用经验教程分享!

    var values = "userName=" name "; passwords=" pass;Rlf办公区 - 实用经验教程分享!

    // 写入值到label标签Rlf办公区 - 实用经验教程分享!

    document.getElementById("mylabel").innerHTML = values;Rlf办公区 - 实用经验教程分享!

    // 从cookie中获取值的方法Rlf办公区 - 实用经验教程分享!

    function getCookie(name) {Rlf办公区 - 实用经验教程分享!

    var arr,reg=new RegExp("(^| )" name "=([^;]*)(;|$)");Rlf办公区 - 实用经验教程分享!

    if(arr=document.cookie.match(reg))Rlf办公区 - 实用经验教程分享!

    return unescape(arr[2]);Rlf办公区 - 实用经验教程分享!

    elseRlf办公区 - 实用经验教程分享!

    return null;Rlf办公区 - 实用经验教程分享!

    }Rlf办公区 - 实用经验教程分享!

    /script>Rlf办公区 - 实用经验教程分享!

    /body>Rlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 5

    到这里我们就已经写完测试案例了,接下来让我们来测试一下。Rlf办公区 - 实用经验教程分享!

  • 测试

  • 1

    我们用打开A.htmlRlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 2

    在A.html内输入用户名:asdfqwer,密码:qwe123,然后点击登录按钮Rlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 3

    可以看到结果完全符合我们的要求Rlf办公区 - 实用经验教程分享!

    js如何设置cookieRlf办公区 - 实用经验教程分享!

  • 注意事项

    • 更多精彩内容请关注小编,有任何我们也可以和小编交流
    • 希望您能动动手指为小编点赞

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!Rlf办公区 - 实用经验教程分享!


    标签: 编程语言

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码