JS读写cookie简单示例

最新推荐文章于 2024-07-28 20:27:10 发布
最新推荐文章于 2024-07-28 20:27:10 发布
阅读量168 收藏
点赞数
分类专栏： 06_script技术 文章标签： function date button javascript cookies
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wwwwwwking/article/details/8024695
版权 
<html>
<head>
	<title> cookies操作 </title>
	<script language="javascript" type="text/javascript">
	function addCookie(name, value, hours) {
		var str = name + "=" + escape(value);
		if (hours > 0) {
			var date = new Date();
			var ms = hours * 60 * 60 * 1000;
			date.setTime(date.getTime() + ms);
			str += ";expires=" + date.toGMTString();
		}
		document.cookie = str;
		alert ("添加cookie成功");
	};
	
	function getCookie(name) {
		var arrStr = document.cookie.split(";");
		for (var i = 0; i < arrStr.length; ++i) {
			var temp = arrStr[i].split('=');
			if (temp[0] == name) {
				return unescape(temp[1]);
			}
		}
	};

	function delCookie(name) {
		var date = new Date();
		date.setTime(date.getTime() - 1000);
		document.cookie = name + "=a;expires=" + date.toGMTString();
	};

	function allCookie() {
		var str =  document.cookie;
		if (str != "") {
			str = "没有任何cookie";
		}
		alert (str);
	};

	function saveCookie() {
		var value = document.getElementById("tmp").value;
		addCookie("test", value, 2);
	};

	function alertCookie() {
		var value = getCookie("test");
		alert(value);

	};
	</script>
</head>
<body>
	<form>
		<input type="text" id="tmp" name="tmp" />
		<input type="button" value="保存" οnclick="saveCookie()" />
		<input type="button" value="读取" οnclick="alertCookie()" />
	</form>
</body>
</html>


 

wwwwwwking
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【React 】开发环境搭建详细指南
lph159的博客
07-24 1181
无论你是刚刚开始学习 React，还是希望在现有项目中采用 React 技术，搭建一个高效的开发环境都是至关重要的。本文将详细介绍如何从零开始搭建 React 开发环境，涵盖所需的工具和最佳实践，帮助你快速启动并顺利进行开发。Visual Studio Code（VS Code）是目前最流行的代码编辑器之一，提供了丰富的扩展和强大的功能。如果你希望对项目的配置有更多的控制，可以选择手动配置 React 项目。下载并安装最新版本的 Node.js，安装 Node.js 后，npm 会自动安装。
vue el-select的下拉树形结构 带检索功能
Jokerxiuka的博客
07-26 172
【代码】vue el-select的下拉树形结构。
已解决：vue-office/excel 多个sheet点击切换，滚动条高度不重置，表格视图位置不正确
weixin_42289080的博客
07-26 212
解决 @vue-office/excel 多个sheet切换，内容以及滚动条展示不正确的问题
新手vue学习问题汇总（自用）（长期更新）
最新发布
lapiii的博客
07-28 251
是 ES6 模块语法，用于导出模块的默认成员。在 Vue.js 中，通常用来导出一个组件对象，使其可以在其他文件中被导入并使用。
Vue3可媲美Element Plus Tree组件实战之移除节点
felix_alone2012的博客
07-25 615
《Element Plus Tree - 自定义节点内容》示例中介绍了移除节点的用法，个人觉得作为提供给用户API，应该遵循迪米特法则，把功能实现的细节封装在组件内部，而提供给用户最简单的操作方式，同时在此基础上支持用户的扩展。因此，在API使用的人性化方便，个人觉得element plus做的并不优秀。为此，我们自定义tree组件时对用户API可以设计的更人性化些。
Angular由一个bug说起之八：实践中遇到的一个数据颗粒度的问题
KenkoTech的博客
07-24 747
之所以使用这种比较直接的方式是因为项目中的数据类型已经确定，而且对数字的处理逻辑没有统一在一个文件中。这是大型项目经常遇到的问题，起到相同作用的代码因为一些小的差别而分别写在管理各自功能的文件里。文件存入数据库，这样我们就可以统一维护一个表，不管是前端来处理数据还是后端来处理都能遵守相同的规则。针对这篇文章提到的数字缩写的问题，可以有两种处理方案。来展示数据的功能，这些数据根据不同的类型和单位会为其加上前缀、后缀或者省略小数。
让开发者生活更轻松的 JavaScript 字符串方法
粉丝们务必加入微信粉丝群
07-27 122
前端岗位内推来了JavaScript 最初被引入作为一种简单的客户端脚本语言，但现在，它已经成为一种真正的 WORA（一次编写到处运行）语言，使开发者能够构建桌面、移动、电视、CLI 和嵌入式应用程序。JavaScript 的初学者友好语法、生产性语言特性和良好管理的 ECMAScript 规范，激励了所有人使用 JavaScript 进行通用编程。ECMAScript 标准通过提供许多语言特性来...
爬虫基本原理入门
RHeng的博客
07-25 1073
爬虫（Web Crawler），又称为网络爬虫或网页蜘蛛，是一种按照一定的规则，自动地抓取万维网信息的程序或者脚本。它们可以模拟浏览器行为，遍历网页并抓取网页中的信息，如文本、图片、链接等。接下来，我们会尝试使用Python等编程语言，结合相关库和工具，动手编写自己的爬虫程序，探索更多关于爬虫技术的奥秘。
Vue3学习总结
inside802的博客
07-28 159
9、计算属性：使用computed属性，可以给template传递一个经过计算后的值，当这个值放在缓存中，当这个值不发生改变时，则JS不会再次执行computed，这样就能提高运行速度。4、属性绑定：使用v-bind:命令来实现属性绑定，如果是绑定单个属性，命令为v-bind:attr=“attr”，也可以写为v-bind:attr，也可以简写为：。11、绑定CSS样式，是通过绑定style属性来实现的，语法为v-bind:style=“myStyle”.其中，myStyle是在vue中自定义的样式。
npm与webpack的学习笔记
2301_79614379的博客
07-28 784
定义：npm是Node.js标准的软件包管理器。它起初是作为下载和管理Node.js包依赖的方式，但其现在也已成为前端JavaScript中使用的工具。
如何关闭页面报错的遮罩层
karlaofsky的博客
07-25 207
在vue.config.js中添加如下配置，问题：如何关闭页面报错的遮罩层。
牛客JS题（二）直角三角形
不起眼小菜菜的博客
07-25 222
注释很详细，直接上代码……
09 ES6的模块化语法
gt8011的博客
07-22 578
ECMAScript 6（简称ES6）是JavaScript语言的下一代标准，其中引入了许多新特性，包括模块化语法。ES6的模块化语法允许开发者将代码分割成独立的模块，每个模块可以包含变量、函数和其他资源，并且可以在不同的文件中进行导入和导出。
从0开始搭建vue + flask 旅游景点数据分析系统（四）：编写前端首页【数据驾驶舱】
roccreed的专栏
07-28 189
- 本期我们编写数据驾驶舱页面(Dashboard)这个页面。 - 主要任务是引入echarts 组件编写数据驾驶舱页面。
从0开始搭建vue + flask 旅游景点数据分析系统（三）：开发header部分
roccreed的专栏
07-28 129
编写header 部分
刷新当前页面
Garbrielle的博客
07-26 206
相当于按了 F5, 因此缺点也很明显, 体验感不佳, 因为要加载所有页面资源相对较慢, 比较耗时.
【JS逆向课件：第十九课：jQuery】
weixin_50556117的博客
07-24 1002
jQuery是一个快速、简洁的JavaScript框架。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理等功能。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。
记录一次centos部署node高版本踩坑记录
weixin_42770320的博客
07-26 561
最后总结一下，有时候做事情真的不能这么死板，不要在一棵树上吊死，要有多种方案去选择，不要永远去死磕一种方案，反正都是不熟悉的领域，尝试过一定时间，搞不通应该果断放弃，不要总是强迫自己要一定要这种方案，俗话说的好，只要思想不滑坡，办法总比困难多哈哈哈，最后真的真的非常非常感激docker，docker真的神中神中神中神。
vue3.0学习--创建项目，基于vite创建
yinge0508的博客
07-27 108
1，执行创建命令 npm create vite@latest。4，npm run format ---- 通常用于代码格式化。2, cd my3d ---- my3d 是创建的项目名字。3，npm install ---- 安装需要的插件包。5, npm run dev --- 运行项目。
读写cookie 封装
07-13
当涉及到读写 Cookie 时，可以使用以下方法进行封装： 1. 设置 Cookie：使用`document.cookie`属性来设置 Cookie。通过传递参数来设置 Cookie 的名称、值以及其他可选的属性（例如过期时间、路径等）。封装一个函数如下： ```javascript function setCookie(name, value, days, path) { let expires = ""; if (days) { let date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); expires = "; expires=" + date.toUTCString(); } document.cookie = name + "=" + (value || "") + expires + "; path=" + (path || "/"); } ``` 使用示例： ```javascript setCookie("username", "John Doe", 7); // 设置一个名为 "username" 的 Cookie，有效期为7天 ``` 2. 获取 Cookie：使用`document.cookie`属性来获取所有的 Cookie，然后解析出指定名称的 Cookie 值。封装一个函数如下： ```javascript function getCookie(name) { let cookieArr = document.cookie.split("; "); for (let i = 0; i < cookieArr.length; i++) { let cookiePair = cookieArr[i].split("="); if (name === cookiePair[0]) { return decodeURIComponent(cookiePair[1]); } } return null; } ``` 使用示例： ```javascript let username = getCookie("username"); // 获取名为 "username" 的 Cookie 值 ``` 3. 删除 Cookie：通过设置 Cookie 的过期时间为过去的时间来删除 Cookie。封装一个函数如下： ```javascript function deleteCookie(name) { document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; } ``` 使用示例： ```javascript deleteCookie("username"); // 删除名为 "username" 的 Cookie ``` 这样，你可以封装这些函数，以便在需要的时候方便地操作 Cookie。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值