JQuery之cookie增删改查操作

Java Web开发中cookie一般有两种新建方法,一种是在Java中创建维护,另一种是在前端中创建和维护。

二者之间最大的区别就是:Java中的cookie是建立在服务器上面是,通过网络传输给客户端的,如果不能连接服务器就无法把cookie保存在客户端上面。而在前端中一般使用JQuerycookie插件实现的,不需要连接服务器就可以在本地新建cookie,进行cookie的相关操作了。

下面对JQuery中cookie的用法进行详细的讲解:

在使用前要先引入jQuery的库文件,和 jquery.cookie.js 的库文件。 需要注意的是:JQuery必须先行引入,而后才是cookie文件,反正则错误。

现在先看一个例子:

<html>
<head>
<meta charset="UTF-8">
<title>js中字符串处理</title>
</head>
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript">

	function newCookieFunc(){
		$.cookie('cookieId',"201211011",{expires:2,path: '/'});
		$.cookie('cookieName',"linzhiqiang",{expires:2,path: '/'});
		alert("新建cookie成功,值分别为:cookieId:201211011  cookieName:linzhiqiang");
	};
	function getCookieFunc(){
		var cookieId=$.cookie('cookieId');
		var cookieName=$.cookie('cookieName');
		alert("cookie的值分别为:cookieId:"+cookieId+"  cookieName:"+cookieName);
	};
	function deleteCookieFunc(){
		$.cookie('cookieId',null,{expires:-1,path: '/'});
		$.cookie('cookieName',null,{expires: -1,path: '/'});
		alert("删除cookie成功");
	};
</script>

<body>
	<input type="button" onclick="newCookieFunc();" value="利用JQuery新建cookie信息"></br>
	<input type="button" onclick="getCookieFunc();" value="利用JQuery读取cookie信息"></br>
	<input type="button" onclick="deleteCookieFunc();" value="利用JQuery删除cookie信息"></br>
</body>
</html>

基本的用法就这些,关于cookie中的参数这里进行稍微的解释一下:

1).expires: 365  定义cookie的有效时间,值可以是一个数字(从创建cookie时算起,以天为单位)或一个Date 对 象。如果省略,那么创建的cookie是会话cookie,将在用户退出浏览器时被删除。  2).path: '/'  默认情况:只有设置cookie的网页才能读取该cookie。 定义cookie的有效路径。默认情况下, 该参数的值为创建 cookie 的网页所在路径(标准浏览器的行为) 。 如果你想在整个网站中访问这个cookie需要这样设置有效路径:path: '/'。如果你想删除一个定义 了有效路径的 cookie,你需要在调用函数时包含这个路径:$.cookie('the_cookie', null, { path: '/' });。 domain: 'example.com' 默认值:创建 cookie的网页所拥有的域名。 

3).secure: true  默认值:false。如果为true,cookie的传输需要使用安全协议(HTTPS)。 

4).raw: true 

默认值:false。 默认情况下,读取和写入 cookie 的时候自动进行编码和解码(使用encodeURIComponent 编码, decodeURIComponent 解码)。要关闭这个功能设置 raw: true 即可。

运行截图:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏我是攻城师

关于kafka连接的一个小问题

2884
来自专栏李蔚蓬的专栏

Debugexperience about SQLite & LitePal:创建数据库闪退?注意小括号

在添加表/更改onUpgrade()之后,记得在调用的代码那里(下图第16行),更改第四个参数(version):

964
来自专栏玩转JavaEE

一个简单的案例带你入门Dubbo分布式框架

相信有很多小伙伴都知道,dubbo是一个分布式、高性能、透明化的RPC服务框架,提供服务自动注册、自动发现等高效服务治理方案,dubbo的中文文档也是非常全的,...

3306
来自专栏测试开发架构之路

Tomcat入门

1、JavaWeb概念 Java web,是用java技术来解决相关web互联网领域的技术的总称。web包括:web服务器和web客户端两部分。 java在...

4467
来自专栏Java帮帮-微信公众号-技术文章全总结

springboot入门(4)_web开发

springboot入门(4)_web开发 摘要: 前几篇大概介绍了demo的搭建运行,Thymeleaf模板引擎的整合还有运行原理(主要是自动默认配置star...

4179
来自专栏pangguoming

整合spring cloud云架构 - SSO单点登录之OAuth2.0登录认证(1)

之前写了很多关于spring cloud的文章,今天我们对OAuth2.0的整合方式做一下笔记,首先我从网上找了一些关于OAuth2.0的一些基础知识点,帮助大...

1096
来自专栏Java技术栈

Spring import配置文件使用占位符

import使用占位符 连接池切换导入配置的代码: <import resource="classpath:META-INF/spring/spring-${d...

35413
来自专栏FreeBuf

从Windows 10 SSH-Agent中提取SSH私钥

在这个周末我安装了Windows 10 Spring Update,最令我期待的就是它的内置OpenSSH工具,这意味着Windows管理员不再需要使用Putt...

983
来自专栏杂烩

Invalid character found in the request target. The valid characters are defined in RFC 7230 and RF

原因是升级后的tomcat设置了url参数解析规则,限制非法字符,如  |  ,解决办法是:

922
来自专栏从零开始学自动化测试

Selenium3+python自动化50-环境搭建(firefox)

前言 有不少小伙伴在安装selenium环境后启动firefox报错,因为现在selenium升级到3.0了,跟2.0的版本还有有一点区别的。 安装环境过程中...

2625

扫码关注云+社区