百搜论坛欢迎您的加入!
adimg adimg
 
昨日:篇  今日:篇   总帖:篇   会员:
博主最大Lv63   
javascript 中Cookie读、写与删除操作(图文教程)     
这篇文章主要介绍了javascript 中Cookie读、写与删除操作的相关资料,需要的朋友可以参考下

javascript 中Cookie读、写与删除操作

前言:

在这个前端横行的时候,页面之间的交互需要数据的传递,有的数据通过url传参的形式可以很好地解决,但是对于部分需要改变的参数,你如说从页面A到页面B选择数据,然后从页面B将数据再传到页面A(典型的栗子就是收货地址的选择),针对这一块我是通过存储cookie来解决的。

对于cookie的操作我给出了一些简单的封装,当然也借鉴了前辈们经验,自己糅合了一下,对于cookie的操作,无非是读写和删除,我们首先来看一下写的操作,有写才有读,进而进行删除等操作。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

/**

 * 设置COOKIE

 * @param name 设置cookie的属性名

 * @param value 设置cookie的属性值

 * @param time  设置cookie的时间

 */

 

function setCookie(name, value , time) {

  time = time ? parseFloat(time) : 0 ;

  var exp = new Date();

  exp.setTime(exp.getTime() + time);

  // escape 这种编码方式过时了 改用 encodeURIComponent

  // document.cookie = name + "=" + escape(value) + ";expires=" + (time ? exp.toGMTString() : 'session');

  document.cookie = name + "=" + encodeURIComponent(value) + ";expires=" + (time ? exp.toGMTString() : 'session');

}

我们有了写的操作了,那么我们再来看看对于读的操作。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

/**

 * 获取cookie

 * @param name

 * @returns {null}

 */

 

function getCookie(name) {

  var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");

  if (arr = document.cookie.match(reg))

    //unescape这种解码方式好像过时了,可以采用decodeURIComponent解码方式

    //return unescape(arr[2]);

     return decodeURIComponent(arr[2]);

  else

    return null;

}

接下就是对cookie的删除操作了,其实这个操作很简单,就是将cookie设置过期,cookie就自动失效了

1

2

3

4

5

6

7

8

9

10

11

12

/**

 * 删除cookie

 * @param name

 */

 

function delCookie(name) {

  var exp = new Date();

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

  var cval = getCookie(name);

  if (cval != null)

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

}

以上就是对cookie的一些简单操作

接下来我们来谈一点cookie的深层次的问题:cookie的跨域

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

Js跨域同步cookie怎么实现

    document.cookie = "name=" + "value;" + "expires=" + "datatime;" + "domain=" + "" + "path=" + "/path" + "; secure";

 

/**

 * 删除cookie

 * value Cookie值

 * expires 有效期截至(单位毫秒)

 * path 子目录

 * domain 有效域

 * secure 是否安全

 */

 

<iframe src='http://网站:1234/test/Index' width='100' height='100' style="display:none"></iframe>

 

/*

*原页面js里 window.location = "http://另外一个网站:1234/GetCookie/Index?" + document.cookie;跳到另外一个站,另外一个站获取cookie,设置cookie

*/

 

 var url = window.location.toString();//获取地址

 var get = url.substring(url.indexOf("liuph"));//获取变量和变量值

 var idx = get.indexOf("=");//获取变量名长度

 if (idx != -1) {

    var name = get.substring(0, idx);//获取变量名

    var val = get.substring(idx + 1);//获取变量值

    setCookie(name, val, 1);//创建Cookie

  }

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

Node.js+Koa实现JWT用户认证步骤详解

jQuery.i18n.properties如何实现js国际化标准

动态加载JS文件三种方式总结

以上就是javascript 中Cookie读、写与删除操作(图文教程)的详细内容

 0  已被阅读了1052次  楼主 2020-06-22 19:19:39
回复列表

回复:javascript 中Cookie读、写与删除操作(图文教程)

联系站长 友链申请桂ICP备19000949号-1     桂ICP备19000949号-1
您的IP:3.139.83.178,2024-05-16 23:37:12,Processed in 0.03254 second(s).
免责声明: 本网不承担任何由内容提供商提供的信息所引起的争议和法律责任。
Powered by HadSky 7.12.9
已有0次打赏
(0) 分享
分享
取消
免责声明
1、本站资源,均来自网络,版权归原作者,所有资源和文章仅限用于学习和研究目的 。
2、不得用于商业或非法用途,否则,一切责任由该用户承担 !
如果觉得本文还不错请点个赞或者打赏点轻币哦~
拒绝伸手党,拿走请回复,尊重楼主,尊重你我他~

侵权删除请致信 E-Mail:207882320@qq.com