jQuery.cookie.js使用方法及相关参数解释

简介

jQuery.cookie.js 是一个轻量级的jQuery插件，用于方便地读取、写入和删除Cookies。本攻略将详细介绍该插件的使用方法及参数解释。

安装

首先需要引入 jQuery 库，然后将 jquery.cookie.js 引入到 HTML 页面中。

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.cookie/1.4.1/jquery.cookie.min.js"></script>

参数

jQuery.cookie.js 支持的参数如下：

expires

expires 用于设置过期时间，可以是数值或字符串：

$.cookie('name', 'value', { expires: 7 }); // 7天后过期
$.cookie('name', 'value', { expires: '7' }); // 与以上等效

expires 也可以设置为日期对象：

var date = new Date();
date.setTime(date.getTime() + (7 * 24 * 60 * 60 * 1000)); // 7天后过期
$.cookie('name', 'value', { expires: date });

path

path 用于设置 cookie 可获取的路径：

$.cookie('name', 'value', { path: '/' });

domain

domain 用于设置 cookie 可获取的域名：

$.cookie('name', 'value', { domain: 'example.com' });

secure

secure 用于设置 cookie 仅通过 HTTPS 传输：

$.cookie('name', 'value', { secure: true });

方法

写入 Cookie

通过以下方法可以在客户端写入 Cookie：

$.cookie('name', 'value');

如果需要使用参数，则可以在第三个参数中传入参数名和值：

$.cookie('name', 'value', { expires: 7, path: '/', domain: 'example.com', secure: true });

读取 Cookie

通过以下方法可以在客户端读取 Cookie：

$.cookie('name');

删除 Cookie

通过以下方法可以在客户端删除 Cookie：

$.removeCookie('name');

如果需要使用参数，则可以在第二个参数中传入参数名和值：

$.removeCookie('name', { path: '/' });

示例

以下是两个示例，展示了如何使用 jQuery.cookie.js：

示例一：记住用户

// 写入 Cookie
$.cookie('username', 'John Doe', { expires: 7 });

// 读取 Cookie
alert('Welcome back, ' + $.cookie('username') + '!');

// 删除 Cookie
$.removeCookie('username');

示例二：保存设置

// 获取用户设置（默认值为 light）
var settings = $.cookie('settings') || 'light';

// 应用设置
$('body').addClass(settings);

// 更改设置
$('#settings-link').on('click', function() {
  $('body').removeClass('light dark').addClass($(this).data('theme'));
  $.cookie('settings', $(this).data('theme'), { expires: 365, path: '/' });
});

以上示例展示了如何保存用户设置，以及如何在页面载入时读取该设置并应用。