你的观察是正确的!实际上,无论是使用 .prop('href')
还是 .attr('href')
,浏览器在解析 HTML 时都会自动将 &
转换为 &
(这是 HTML 规范的标准行为)。如果目标是 保留原始字符串中的 &
,需要通过其他方式提取。
解决方案:直接从原始字符串中提取(不依赖 DOM 解析)
因为浏览器/DOM 会强制标准化属性值,所以最可靠的方法是 跳过 jQuery/DOM 解析,直接操作原始字符串:
let str = `<a url_type="" class="J_menuItem" href="https://10.8.87.73:9876/backstage/workflow/flowRun/myAllJobsList?menu=25389880aa664d8ab08d308c094256a3&GratuitousProxy=c1a516fc7f385b92a23305733f31b2a0" data-index="5" style="color: rgb(94, 95, 97);">所有工单</a>`;
// 方法1:正则匹配(精确提取 href 内容)
const match = str.match(/href="([^"]*&[^"]*)"/);
console.log(match[1]); // ✅ 输出包含 &
// 方法2:替换回 &(如果已转义)
const decodedUrl = $(str).prop('href'); // 先获取标准化的 URL
const encodedUrl = decodedUrl.replace(/&/g, '&'); // 手动替换回 &
console.log(encodedUrl); // ✅ 输出包含 &
关键原因
- 浏览器/DOM 的标准化行为:
当 HTML 被解析为 DOM 时,属性值中的&
会自动转换为&
。这是 HTML 规范的要求(如<a href="...&...">
→<a href="...&...">
)。 - 唯一可靠的方法:
如果需要保留原始的&
,必须直接从字符串中提取(不经过 DOM 解析)。
输出结果
https://10.8.87.73:9876/backstage/workflow/flowRun/myAllJobsList?menu=25389880aa664d8ab08d308c094256a3&GratuitousProxy=c1a516fc7f385b92a23305733f31b2a0
选择 方法1 (正则匹配)可以确保完全绕过浏览器的干扰!
内容由零声教学AI助手提供,问题来源于学员提问