在上篇文章给大家介绍了HTML页面3秒后自动跳转的三种常见方法，本文继续给大家介绍有关html页面跳转相关知识，一起学习吧。
下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。
1）html的实现
复制代码
代码如下:
<head>
<metahttp-equiv="refresh"content="5;url=hello.html">
</head>
优点：简单
缺点：StrutsTiles中无法使用
2）javascript的实现
复制代码
代码如下:
<mce:scriptlanguage="javascript"type="text/javascript"><!--
setTimeout("javascript:location.href='http://liting6680.blog.163.com/blog/hello.html'",5000);
//--></mce:script>
优点：灵活，可以结合更多的其他功能
缺点：受到不同浏览器的影响
3）结合了倒数的javascript实现（IE）
复制代码
代码如下:
<spanid="totalSecond">5</span>
<mce:scriptlanguage="javascript"type="text/javascript"><!--
varsecond=totalSecond.innerText;
setInterval("redirect()",1000);
functionredirect(){
totalSecond.innerText=--second;
if(second<0)location.href='http://liting6680.blog.163.com/blog/hello.html';
}
//--></mce:script>
优点：更人性化
缺点：firefox不支持（firefox不支持span、p等的innerText属性）
3）结合了倒数的javascript实现（firefox）
复制代码
代码如下:
<mce:scriptlanguage="javascript"type="text/javascript"><!--
varsecond=document.getElementById('totalSecond').textContent;
setInterval("redirect()",1000);
functionredirect()
{
document.getElementById('totalSecond').textContent=--second;
if(second<0)location.href='http://liting6680.blog.163.com/blog/hello.html';
}
//--></mce:script>
4）解决Firefox不支持innerText的问题
复制代码
代码如下:
<spanid="totalSecond">5</span>
<mce:scriptlanguage="javascript"type="text/javascript"><!--
if(navigator.appName.indexOf("Explorer")>-1){
document.getElementById('totalSecond').innerText="mytextinnerText";
}else{
document.getElementById('totalSecond').textContent="mytexttextContent";
}
//--></mce:script>
5）整合3）和3'）
复制代码
代码如下:
<spanid="totalSecond">5</span>
<mce:scriptlanguage="javascript"type="text/javascript"><!--
varsecond=document.getElementById('totalSecond').textContent;
if(navigator.appName.indexOf("Explorer")>-1)
{
second=document.getElementById('totalSecond').innerText;
}else
{
second=document.getElementById('totalSecond').textContent;
}
setInterval("redirect()",1000);
functionredirect()
{
if(second<0)
{
location.href='http://liting6680.blog.163.com/blog/hello.html';
}else
{
if(navigator.appName.indexOf("Explorer")>-1)
{
document.getElementById('totalSecond').innerText=second--;
}else
{
document.getElementById('totalSecond').textContent=second--;
}
}
}
//--></mce:script>
本文转载自中文网
本文转载自中文网
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h55093.shtml
