最直接可靠的浏览器跳转方式是设置window.location.href，它立即导航、支持历史记录且兼容性好；应避免使用window.location或assign()，相对路径需注意协议和域名依赖，参数传递推荐urlsearchparams以防乱码，replace()会替换历史记录不可回退。
用 window.location.href 跳转最直接
浏览器环境里，跳转页面最常用、最可靠的方式就是改写 window.location.href。它会立刻触发导航，行为和用户点链接完全一致，支持历史记录、能被后退键捕获。
常见错误是写成 window.location = 'xxx' 或 window.location.assign('xxx') —— 虽然也能跳，但前者可读性差，后者在部分老版本 Safari 有兼容问题；href 是标准、明确、无歧义的选择。
-
window.location.href = 'https://example.com'：立即跳转，保留当前页历史 -
window.location.href = '/login'：相对路径跳转，依赖当前域名和协议 - 不要在跳转前调用
event.preventDefault()后又忘记手动跳转，否则页面卡住
跳转时要不要带参数？看场景选方式
如果只是简单跳转，拼 query 字符串就行；但如果参数含中文、特殊符号或结构复杂，必须用 URLSearchParams 构建，否则容易乱码或解析失败。
比如用户点击按钮跳转到搜索页并带关键词：q=前端面试题，直接拼接 '/search?q=' + keyword 在中文下大概率出错。
立即学习“前端免费学习笔记（深入）”；
- 安全做法：
const url = new URL('/search', window.location.origin); url.searchParams.set('q', '前端面试题'); window.location.href = url.toString(); - 避免手写编码：
encodeURIComponent()容易漏掉或嵌套调用，URLSearchParams自动处理 - 服务端重定向（如 302）不走 JS，无法动态传参；前端跳转才是参数可控的路径
location.replace() 和 href 的关键区别
两者都会跳转，但 location.replace() 会把当前页从历史栈中“替换”掉，用户点后退不会回到原页面；而 href 是新增一条历史记录。
典型误用场景：登录成功后跳首页，用了 replace，结果用户按返回键直接退出了网站——这不是 bug，是设计如此，但常被忽略。
- 用
window.location.replace('https://example.com')：适合表单提交后防重复提交、OAuth 回调页等不需要回退的场景 - 用
window.location.href = 'https://example.com'：普通导航、用户可能想返回的任何操作 - 注意：两者都不触发
beforeunload，所以别指望靠它弹窗提醒未保存数据
为什么有时跳转没反应？检查这三处
跳转代码写了，控制台也没报错，但页面纹丝不动——大概率不是语法问题，而是执行时机或上下文不对。
最常见的三个坑：事件监听器没绑定成功、脚本执行早于 DOM 加载、跨域 iframe 里调用受限。
- 确保 JS 在
<button onclick="go()"></button>之后执行，或包裹在DOMContentLoaded里 - 在 iframe 中调用跳转，若父页与子页不同源，
window.location会被浏览器静默拦截，控制台可能只报SecurityError - Vue/React 等框架里，直接改
window.location.href没问题，但若在异步回调（如fetch().then()）里跳转，要确认 Promise 确实 resolved 了，别被未捕获的 reject 搞定
