js 实现跳转
使用 window.location.href 进行跳转
通过修改 window.location.href 可以跳转到指定 URL，浏览器会加载新页面：
window.location.href = 'https://example.com';使用 window.location.replace 替换当前页面
replace 方法会替换当前页面，且不会在浏览器历史记录中留下原页面的记录：
window.location.replace('https://example.com');使用 window.open 在新窗口或标签页打开
通过 window.open 可以在新窗口或标签页中打开链接，支持指定窗口特性：
window.open('https://example.com', '_blank');使用 location.assign 加载新页面
assign 方法会加载新页面，并在浏览器历史记录中保留原页面：
window.location.assign('https://example.com');使用锚点 (hash) 进行页面内跳转
通过修改 location.hash 可以实现页面内的锚点跳转：
window.location.hash = '#section-id';使用 history.pushState 或 replaceState 无刷新跳转
适用于单页应用 (SPA)，通过 pushState 或 replaceState 修改 URL 而不刷新页面：
history.pushState({}, '', '/new-path');或
history.replaceState({}, '', '/new-path');使用 <a> 标签模拟点击跳转
通过 JavaScript 创建或触发 <a> 标签的点击事件实现跳转：
const link = document.createElement('a');
link.href = 'https://example.com';
link.click();使用 meta 标签自动跳转
通过动态插入 <meta> 标签实现自动跳转：
const meta = document.createElement('meta');
meta.httpEquiv = 'refresh';
meta.content = '0;url=https://example.com';
document.head.appendChild(meta);使用表单提交跳转
通过动态创建表单并提交实现跳转：
const form = document.createElement('form');
form.action = 'https://example.com';
form.method = 'POST';
document.body.appendChild(form);
form.submit();注意事项
- 使用
window.open可能会被浏览器弹窗拦截器阻止。 replace和assign的区别在于是否保留历史记录。pushState和replaceState需配合前端路由框架使用。- 锚点跳转仅适用于页面内已有对应
id的元素。
