掌握Javascript页面跳转与自动刷新技巧及实例

需积分: 11 189 浏览量更新于2024-09-13 收藏 52KB DOC 举报

在网页开发中，JavaScript是一种强大的脚本语言，常用于控制页面的行为和交互。本文主要介绍如何利用JavaScript实现页面的跳转与自动刷新，这对于构建动态和交互式的网站至关重要。首先，让我们看看JavaScript刷新页面的几种常见方法： 1. `history.go(0)`：这个方法会将浏览器的历史记录向前滚动到当前页面，达到刷新的效果。例如，`window.location = history.go(0);` 会直接重新加载当前页面。 2. `location.reload()`：这个函数会强制页面从服务器获取最新的内容，即使内容未改变也会重新下载。可以带有可选的参数，如 `location.reload(true)` 会让浏览器忽略缓存，确保每次都是全新的请求。 3. `location=location`：通过将location对象赋值给自己，实际上是创建了一个新的URL请求，实现页面刷新。 4. `location.assign(location)`：这相当于在地址栏中输入当前页面的URL，同样触发页面刷新。 5. `document.execCommand('Refresh')`：虽然这个方法在过去常常被用作刷新，但在现代浏览器中可能不被推荐，因为它可能导致一些兼容性问题。 6. `window.navigate(location)`：这是早期IE浏览器特有的方法，现在大部分浏览器已经不再支持，不建议使用。 7. `location.replace(location)`：这个方法会替换当前页面，但不会添加到浏览器历史记录中，适合无链接的刷新操作。 8. `document.URL=location.href`：虽然看似能实现跳转，但这并不会触发页面的刷新，只是改变URL显示，实际内容未变。接下来是页面的自动刷新。有两种方式： - **Meta标签刷新**：在HTML `<head>` 标签内添加 `<meta http-equiv="refresh" content="间隔时间;URL(新URL)">`，如 `content="20;url=http://www.wyxg.com"`，会在指定时间（这里是20秒）后自动跳转到指定的新URL。 - **JavaScript函数刷新**：定义一个函数，如 `function myrefresh() { window.location.reload(); }`，然后使用 `setTimeout` 设置定时器来定期执行这个函数，如 `setTimeout('myrefresh()', 1000)`，可以实现每隔1秒自动刷新页面。此外，对于嵌套的框架页面，还有特定的刷新机制： - **刷新包含框架的页面**：`parent.location.reload()` 用于父页面刷新包含的子框架。 - **子窗口刷新父窗口**：`self.opener.location.reload()` 或者 `<a href="javascript:opener.location.reload()">刷新</a>` 可以让子窗口刷新其父窗口。 - **刷新另一个框架的页面**：`parent.另一FrameID.location.reload();` 用于刷新其他框架。最后，如果希望在特定事件（如打开新窗口或关闭当前窗口）发生时刷新页面，可以在对应的 `<body>` 标签属性中设置 `onload` 和 `onunload` 事件，如 `body.onload="opener.location.reload()"`。掌握这些JavaScript页面跳转和刷新技巧，可以极大地增强网页的动态交互体验，但需要注意的是，频繁的自动刷新可能会对用户体验造成负面影响，因此应在必要时谨慎使用。

引用 Javascript 刷新页面的几种方法

Javascript 刷新页面的几种方法：

1 history.go(0)

2 location.reload()

3 location=location

4 location.assign(location)

5 document.execCommand('Refresh')

6 window.navigate(location)

7 location.replace(location)

8 document.URL=location.href

自动刷新页面的方法:

1.页面自动刷新：把如下代码加入<head>区域中

其中 20 指每隔 20 秒刷新一次页面.

2.页面自动跳转：把如下代码加入<head>区域中

其中 20 指隔 20 秒后跳转到 http://www.wyxg.com 页面

3.页面自动刷新 js 版

function myrefresh()

{

 window.location.reload();

}

setTimeout('myrefresh()',1000); //指定 1 秒刷新一次

</script>

JS 刷新框架的脚本语句

//如何刷新包含该框架的页面用

 parent.location.reload();

下载后可阅读完整内容，剩余7页未读，立即下载

xujishanandbruce

粉丝: 3
资源: 3

掌握Javascript页面跳转与自动刷新技巧及实例

JavaScript页面跳转与刷新代码汇总

JavaScript页面跳转与刷新完全指南

JavaScript实现页面刷新与滚动效果

javascript页面跳转常用代码.pdf

javascript页面跳转常用代码宣贯.pdf

javascript跳转与返回和刷新页面的实例代码.docx

JavaScript常用的返回，自动跳转，刷新，关闭语句汇总

页面定时自动刷新代码实现

js页面跳转 多种javascript页面中转方法

页面跳转代码

最新资源

js页面跳转多种javascript页面中转方法