现代浏览器不支持JavaScript直接添加书签，唯一可靠方式是提示用户手动按Ctrl+D或Cmd+D；代码通过alert明确指引操作，并兼容各主流浏览器，其他自动方案均被安全策略阻止。
点击按钮直接触发浏览器书签添加（不依赖第三方库）
现代浏览器基本不支持 JavaScript 主动调用书签添加 API，window.external.AddFavorite 是 IE 专属且早已废弃，chrome.bookmarks 或 firefox.browser.bookmarks 属于扩展权限范畴，网页脚本无权访问。所谓“一键加书签”，本质是引导用户手动操作，但可通过标准 Web API 最大化降低操作成本。
核心思路：用 location.href 触发浏览器默认行为 + 提示文案辅助 + fallback 兜底。
- Chrome / Edge / Firefox / Safari（macOS）支持
javascript:window.location=...链接配合rel="sidebar"（仅 Safari 旧版有效，已弃用） - 真正跨浏览器可行的是：生成带标题和 URL 的
javascript:伪协议链接，再配合alert或 tooltip 提示「请按 Ctrl+D（Windows）或 Cmd+D（Mac）」 - 不要尝试
document.execCommand('AddToFavorites')—— 已被所有主流浏览器移除，调用会静默失败
兼容性最强的按钮写法（含 fallback 提示）
以下代码在 Chrome 110+、Firefox 120+、Safari 17+、Edge 119+ 均可正常显示按钮并给出明确操作指引：
<button onclick="addBookmark()" title="添加当前页到书签">⭐ 加书签</button>
<script>
function addBookmark() {
const url = window.location.href;
const title = document.title || '未命名页面';
// Safari 17+ 支持 addToHomeScreen，但非书签；此处仅作提示
if ('webkitAppearance' in document.documentElement.style && /Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent)) {
alert('Safari：请按 Cmd+D 手动添加书签');
return;
}
// 其他浏览器统一提示
alert(`请按 Ctrl+D（Windows/Linux）或 Cmd+D（Mac）添加书签\n标题：${title}\n地址：${url}`);
}
</script>
注意：alert 虽不够优雅，但能确保用户看到指令；若用 console.log 或 tooltip，则大量用户根本不会注意到。
立即学习“前端免费学习笔记（深入）”；
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
为什么不能用 location.replace('javascript:...') 自动触发？
因为现代浏览器出于安全策略，禁止通过脚本自动触发书签行为。尝试如下代码：
location.replace('javascript:window.external.AddFavorite("'+ document.title +'","'+ location.href +'");');
会导致：SyntaxError: Invalid or unexpected token（因引号嵌套错误），即使修复语法，也会在 Chrome 中报 Uncaught DOMException: Blocked a frame with origin ... from accessing a cross-origin frame，Firefox 直接忽略该语句。
-
window.external.AddFavorite仅 IE6–IE11 支持，且必须在同域 iframe 内调用，现代网页几乎无法满足条件 -
javascript:伪协议在location.href赋值时会被拦截，尤其在 HTTPS 页面中 - 任何试图绕过用户主动按键（Ctrl/Cmd+D）的方案，在 Chromium 和 Gecko 内核中均被明确拒绝
移动端有没有替代方案？
没有真正意义上的“加书签”替代，但可引导用户「添加到主屏幕」（PWA）——这需要满足 PWA 基础条件：
- 页面部署在 HTTPS 协议下
- 存在合法的
manifest.json，且包含"display": "standalone"或"minimal-ui" - 注册了 Service Worker（哪怕只缓存一个空文件）
- 此时才能在 Chrome Android / Safari iOS 上触发
navigator.share或原生「添加到主屏幕」提示
但请注意：add to home screen ≠ 添加书签，它创建的是桌面快捷方式，行为与书签管理器无关，也不会出现在 Chrome 的书签栏里。
真实场景中，最常被忽略的是：很多开发者以为加个 manifest 就能唤起添加提示，其实必须由用户首次访问后，经过至少 30 秒停留 + 页面交互（如滚动、点击），浏览器才会考虑弹出提示 —— 这个时机完全不可控。
