使用jQuery提取背景图URL并去除格式存入Cookie的方法

嗨，这有几个超实用的简洁方法，帮你把带url("")包裹的背景图地址转换成纯URL字符串：

方法1：正则表达式替换（最通用） #

这是最稳妥的方式，不管背景图格式是带双引号、单引号甚至没引号都能处理：

// 获取目标元素的背景图样式
const bgStyle = $('#image > div').css('background-image');
// 用正则剥离掉url()和引号
const pureImageUrl = bgStyle.replace(/^url\(["']?|["']?\)$/g, '');
// 存入站点Cookie（全局生效记得加path=/）
document.cookie = `siteBgImage=${encodeURIComponent(pureImageUrl)}; path=/`;

正则的逻辑很简单：匹配开头的url(加上可选的引号，以及结尾的可选引号加上)，把这些都替换成空字符串就行。

方法2：字符串截取（适合固定格式） #

如果你能确定背景图格式固定是url("xxx")，那直接用字符串截取会更短：

const pureImageUrl = $('#image > div').css('background-image').slice(5, -2);
// 存入Cookie
document.cookie = `siteBgImage=${encodeURIComponent(pureImageUrl)}; path=/`;

slice(5, -2)就是跳过开头的url("（前5个字符），再去掉结尾的")（最后2个字符），一步到位。

小提醒 #

• 一定要用encodeURIComponent对URL编码，避免特殊字符（比如&、空格）导致Cookie存储出错
• 设置path=/能让Cookie在整个站点的页面都能读取到，不然默认只会在当前路径下有效

内容的提问来源于stack exchange，提问作者J. Ayo