在 JavaScript 中有好几种方法可以实现页面跳转, 重定向到另一个网页, 下面本篇文章就来给大家介绍一些使用 JavaScript 实现页面跳转的方法, 希望对大家有所帮助.
使用 JavaScript 实现页面跳转, 跳转到其他网页的一些方法:
● location.href
● location.replace()
● location.assign()
语法:
- location.href="URL"
- // 或者
- location.replace("URL")
- // 或者
- location.assign("URL")
参数: 接受单个参数的 URL, 这是必需的. 用于指定新网页的引用.
返回值: 无返回值.
示例 1: 使用 location.href 属性跳转到其他网页
- <!DOCTYPE html>
- <HTML>
- <head>
- <meta charset="UTF-8">
- </head>
- <body>
- <p>
- 这是
- < i>
- location.href
- </i>
- 方式的示例
- </p>
- <button onclick="myFunc()">
- 点击这里
- </button>
- <!-- 重定向到其他网页的脚本 -->
- <script>
- function myFunc() {
- Windows.location.href = "https://www.html.cn";
- }
- </script>
- </body>
- </HTML>
效果图:
示例 2: 使用 location.replace() 方法跳转到其他网页
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- </head>
- <body>
- <p>
- 这是
- < i>
- location.replace()
- </i>
- 方式的示例
- </p>
- <button onclick="myFunc()">
- 点击这里
- </button>
- <!-- 重定向到其他网页的脚本 -->
- <script>
- function myFunc() {
- location.replace("https://www.html.cn");
- }
- </script>
- </body>
- </HTML>
效果图:
示例 3: 使用 location.assign() 方法跳转到其他网页
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- </head>
- <body>
- <p>
- 这是
- < i>
- location.assign()
- </i>
- 方式的示例
- </p>
- <button onclick="myFunc()">
- 点击这里
- </button>
- <!-- 重定向到其他网页的脚本 -->
- <script>
- function myFunc() {
- location.assign("https://www.html.cn");
- }
- </script>
- </body>
- </HTML>
效果图:
注意: 所有方法的输出都相同, 但 location.replace() 方法从文档历史记录中删除当前文档的 URL. 因此, 如果希望选项导航回原始文档, 最好使用 location.assign() 方法.
浏览器支持
上述方法的浏览器支持列表:
● Google Chrome
● Apple Safari
● Firefox
● Opera
● Edge
来源: http://www.css88.com/qa/javascript/11458.html