JavaScript实现页面跳转的5种方法总结

2025-06-05 15:56:01 编辑：daqian 来源：互联网

1. 使用window.location.href属性

这是最基本的方法。通过设置window.location.href的值为目标页面的url，即可实现跳转。例如：

```javascript

window.location.href = ⁄'target.html⁄';

```

2. 使用window.location.assign()方法

此方法同样用于加载新的页面。它会在浏览器历史记录中生成一条新记录。

```javascript

window.location.assign(⁄'target.html⁄');

```

3. 使用window.location.replace()方法

该方法会用新页面替换当前页面，不会在浏览器历史记录中留下当前页面的记录，所以不能通过后退按钮返回。

```javascript

window.location.replace(⁄'target.html⁄');

```

4. 使用document.location.href属性

与window.location.href类似，不过document对象的这个属性在文档环境中使用。

```javascript

document.location.href = ⁄'target.html⁄';

```

5. 使用html5的meta标签进行自动跳转

在html头部添加meta标签，设置http-equiv属性为“refresh”，content属性指定跳转的时间间隔（秒）和目标url。

```html

```

上述代码表示3秒后自动跳转到target.html页面。

在实际应用中，可根据具体需求选择合适的跳转方法。如果需要在历史记录中添加记录，可使用window.location.href或window.location.assign()；若不想留下当前页面记录，window.location.replace()是不错的选择；而document.location.href则在文档内部跳转时较为常用；meta标签的自动跳转适用于一些有特定时间要求的引导场景。