利用js实现页面跳转

使用 window.location.href 实现跳转

通过修改 window.location.href 属性可以直接跳转到目标 URL。这是最常用的方法之一，会触发页面刷新并加载新页面。

window.location.href = 'https://example.com';

使用 window.location.replace 实现跳转

window.location.replace 会替换当前页面历史记录，用户无法通过浏览器后退按钮返回原页面。

window.location.replace('https://example.com');

使用 window.open 实现新窗口跳转

window.open 可以在新标签页或窗口中打开目标 URL。可通过参数控制窗口行为。

window.open('https://example.com', '_blank');

使用 location.assign 实现跳转

location.assign 方法会加载新文档并保留当前页面在历史记录中，用户可通过后退按钮返回。

location.assign('https://example.com');

使用 HTML 锚点实现跳转

通过动态创建 <a> 标签并触发点击事件实现跳转，适合需要模拟用户点击的场景。

const link = document.createElement('a');
link.href = 'https://example.com';
link.click();

使用 meta 标签实现自动跳转

通过动态插入 <meta> 标签实现页面自动跳转，常用于 SEO 或重定向场景。

const meta = document.createElement('meta');
meta.httpEquiv = 'refresh';
meta.content = '0;url=https://example.com';
document.head.appendChild(meta);

使用表单提交实现跳转

通过创建并提交表单实现跳转，适合需要传递 POST 数据的场景。

const form = document.createElement('form');
form.method = 'POST';
form.action = 'https://example.com';
document.body.appendChild(form);
form.submit();

使用 history.pushState 实现无刷新跳转

history.pushState 可修改 URL 而不刷新页面，适合单页应用（SPA）的路由控制。

history.pushState({}, '', '/new-path');

每种方法适用于不同场景，可根据具体需求选择最合适的实现方式。普通页面跳转推荐使用 window.location.href，单页应用路由推荐使用 history.pushState。