转自：http://blog.sina.com.cn/s/blog_546f2daa0100pxic.html
下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。
1) html的实现
<head>
<!-- 以下方式只是刷新不跳转到其他页面 -->
<meta http-equiv="refresh" content="10">
<!-- 以下方式定时转到其他页面 -->
<meta http-equiv="refresh" content="5;url=hello.html">
</head>
2) javascript的实现
<script language="javascript" type="text/javascript">
// 以下方式直接跳转
window.location.href='hello.html';
// 以下方式定时跳转
setTimeout("javascript:location.href='hello.html'", 5000);
</script>
优点：灵活，可以结合更多的其他功能
缺点：受到不同浏览器的影响
3) 结合了倒数的javascript实现（IE）
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
var second = totalSecond.innerText;
setInterval("redirect()", 1000);
function redirect(){
totalSecond.innerText=--second;
if(second<0) location.href='hello.html';
}
</script>
优点：更人性化
缺点：firefox不支持（firefox不支持span、div等的innerText属性）
Fixfox
<script language="javascript" type="text/javascript">
var second = document.getElementByIdx_x('totalSecond').textContent;
setInterval("redirect()", 1000);
function redirect()
{
document.getElementByIdx_x('totalSecond').textContent = --second;
if (second < 0) location.href = 'hello.html';
}
</script>
4) 解决Firefox不支持innerText的问题
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
if(navigator.appName.indexOf("Explorer") > -1){
document.getElementByIdx_x('totalSecond').innerText = "my text innerText";
} else{
document.getElementByIdx_x('totalSecond').textContent = "my text textContent";
}
</script>
5)整合
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
var second = document.getElementByIdx_x('totalSecond').textContent;
if (navigator.appName.indexOf("Explorer") > -1) {
second = document.getElementByIdx_x('totalSecond').innerText;
} else {
second = document.getElementByIdx_x('totalSecond').textContent;
}
setInterval("redirect()", 1000);
function redirect() {
if (second < 0) {
location.href = 'hello.html';
} else {
if (navigator.appName.indexOf("Explorer") > -1) {
document.getElementByIdx_x('totalSecond').innerText = second--;
} else {
document.getElementByIdx_x('totalSecond').textContent = second--;
}
}
}
</script>
分享到：
相关推荐
HTML页面跳转的方法HTML页面跳转的5种方法 下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。 html的实现
### JSP页面跳转的五种方法 在Java Web开发中，页面间的跳转是非常常见的需求之一。合理的页面跳转不仅可以提升用户体验，还能优化应用程序的结构。本文将详细介绍JSP页面跳转的五种方法：`RequestDispatcher....
JS 页面跳转方法大全 JS 页面跳转方法是 Web 开发中常用的技术之一，用于在不同的页面之间跳转。下面是 JS 页面跳转方法的详细知识点： 1. 使用 window.location.href 实现页面跳转 window.location.href 属性...
在这个“html5 css3圆形进度条倒计时页面跳转代码”项目中，我们可以看到这两者如何结合，创造出动态且吸引用户的界面效果。 首先，HTML5的新特性允许开发者创建更加结构化的网页元素，例如`<article>`、`<section>...
在网页设计中，页面跳转的动画效果是一个重要的组成部分，它不仅能够提升用户体验，还能为网站增添独特的风格和视觉吸引力。下面将详细讲解页面跳转动画效果的相关知识点，并结合"动感的页面加载动画效果"这一主题，...
html5+APP一些常用的html5+plus函数封装、mui+APP常用的处理函数封装、页面跳转、页面关闭、页面刷新、页面支付
综上所述，这个"超炫酷的跳转页面 HTML"项目涉及到HTML的基本结构和链接功能，JavaScript的动态效果和页面跳转控制，以及CSS的样式设计和动画效果。通过这些技术的组合，可以创建出吸引用户并有效引导他们到目标页面...
本文将详细介绍JSP中常见的几种页面跳转方法，并分析它们之间的区别。 #### 二、客户端跳转方法 ##### 1. 使用`<a>`标签超链接 这是最简单直接的方式，通过`<a>`标签的`href`属性设置目标页面的URL来实现跳转。...
2. **不同页面间的锚点跳转**：如果想从一个页面跳转到另一个页面的特定位置，需要在URL后加上目标页面的文件名和锚点ID，例如： ```html <a href="page2.html#section1">跳转到page2的第一部分 ``` 这里要注意，...
在JavaScript中，页面跳转是一种常见的操作，常用于用户交互或者自动导航到其他页面。"js实现5秒后页面跳转"这个主题涉及到的核心知识点主要包括定时器（setTimeout）和window对象的location属性。下面我们将详细...
在这个“html页面跳转传递参数Demo”中，我们将探讨如何在HTML页面之间传递参数，以实现更丰富的用户交互体验。 一、HTML页面跳转 HTML页面跳转主要通过`<a>`标签的`href`属性来实现。例如，我们可以创建一个链接，...
本文将详细介绍C#中的几种页面跳转方法，并针对每种方法的特点进行分析，以便开发者可以根据具体的应用场景选择最合适的方案。 #### 1. 使用`HyperLink`控件 `HyperLink`是一种常见的用于页面跳转的方法。通过设置...
在JSP中，页面跳转可以通过内置的response.sendRedirect()方法来实现。此方法接受一个URL作为参数，使客户端的浏览器重新请求该URL所指向的资源，从而实现页面跳转。 ### 使用meta标签实现页面自动跳转 HTML中的...
本文将深入探讨三种主要的页面跳转方法：Response.Redirect、Server.Transfer和HtmlHelper.ActionLink，并对比它们各自的特性和应用场景。 1. **Response.Redirect** - **原理**：Response.Redirect方法向客户端...
本篇文章将详细讲解HTML页面跳转的五种方法以及JSP与HTML之间的跳转。 一、HTML页面跳转方法 1. HTML的`<a>`标签：最基础的跳转方式是使用`<a>`标签，通过`href`属性指定目标URL，例如： ```html 点击跳转 ``` ...
对于使用 Java Server Pages (JSP) 的开发者来说，掌握不同类型的页面跳转方法非常重要，这不仅有助于提高开发效率，还能增强应用程序的性能与用户体验。本文将详细介绍 JSP 中五种常用的页面跳转方式及其应用场景。...
在静态页面HTML中实现页面跳转的同时传递参数，是一种常见的Web开发需求。本文将详细讲解如何利用JavaScript处理URL中的查询参数，以及如何在目标页面中接收这些参数。通过实例演示，我们会学习到如何使用JavaScript...
本文将深入探讨两种主要的页面跳转方法——`jsp:include`与`jsp:forward`，并结合实例进行分析，帮助开发者更好地理解其应用场景和工作原理。 #### `jsp:include` 动作详解 `jsp:include`动作主要用于将一个JSP...
页面跳转主要用于改善用户体验，例如用户在完成表单填写或执行其他操作后，系统能够自动将其导向下一页面或结果页面。对于用户注册流程来说，通常的做法是用户填写完注册信息并提交后，系统会验证这些信息的有效性。...
网页跳转是网络开发中常用的一种技术，它用于在用户访问特定页面时自动导向其他页面。这在多种情况下非常有用，比如更新网站内容、管理旧链接或者实施SEO策略。然而，不正当使用网页跳转也可能导致搜索引擎优化作弊...