js实现打开页面
使用JavaScript打开新页面
在JavaScript中，可以通过多种方式实现打开新页面的功能。以下是几种常见的方法：
window.open()方法
window.open('https://example.com', '_blank');该方法接受三个参数：URL、窗口名称和窗口特性。_blank表示在新标签页打开。
修改location.href
window.location.href = 'https://example.com';这会直接在当前窗口加载新页面。
使用a标签模拟点击
const link = document.createElement('a');
link.href = 'https://example.com';
link.target = '_blank';
link.click();这种方法不会触发弹出窗口拦截器。
处理弹出窗口拦截
现代浏览器可能会拦截通过window.open()触发的弹出窗口，特别是在非用户交互事件中调用时。最佳实践是将打开页面的操作绑定到用户点击事件：
document.getElementById('myButton').addEventListener('click', () => {
window.open('https://example.com', '_blank');
});自定义窗口特性
window.open()的第三个参数可以指定窗口特性：
window.open('https://example.com', '_blank', 'width=600,height=400');可用特性包括width、height、menubar、toolbar等。
跨域安全限制
需要注意同源策略限制：
- 无法读取或修改不同源窗口的内容
- 只能通过
window.postMessage进行有限的跨域通信
现代替代方案
对于单页应用(SPA)，推荐使用路由库实现页面跳转：
// 使用React Router
import { useNavigate } from 'react-router-dom';
const navigate = useNavigate();
navigate('/new-page');
