HTML页面跳转的5种方法
1)html的实现
<head>
<!--以下方式只是刷新不跳转到其他页面-->
<metahttp-equiv="refresh"content="10">
<!--以下方式定时转到其他页面-->
<metahttp-equiv="refresh"content="5;url=hello.html">
</head>
优点:简单
缺点:StrutsTiles中无法使用
2)javascript的实现
<scriptlanguage="javascript"type="text/javascript">
//以下方式直接跳转
window.location.href='hello.html';
//以下方式定时跳转
setTimeout("javascript:location.href='hello.html'",5000);
</script>
优点:灵活,可以结合更多的其他功能
缺点:受到不同浏览器的影响
3)结合了倒数的javascript实现(IE)
<spanid="totalSecond">5</span>
<scriptlanguage="javascript"type="text/javascript">
varsecond=totalSecond.innerText;
setInterval("redirect()",1000);
functionredirect(){
totalSecond.innerText=--second;
if(second<0)location.href='hello.html';
}
</script>
优点:更人性化
缺点:firefox不支持(firefox不支持span、div等的innerText属性)
3')结合了倒数的javascript实现(firefox)
<scriptlanguage="javascript"type="text/javascript">
varsecond=document.getElementById('totalSecond').textContent;
setInterval("redirect()",1000);
functionredirect()
{
document.getElementById('totalSecond').textContent=--second;
if(second<0)location.href='hello.html';
}
</script>
4)解决Firefox不支持innerText的问题
<spanid="totalSecond">5</span>
<scriptlanguage="javascript"type="text/javascript">
if(navigator.appName.indexOf("Explorer")>-1){
document.getElementById('totalSecond').innerText="mytextinnerText";
}else{
document.getElementById('totalSecond').textContent="mytexttextContent";
}
</script>
5)整合3)和3')
<spanid="totalSecond">5</span>
<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='hello.html';
}else{
if(navigator.appName.indexOf("Explorer")>-1){
document.getElementById('totalSecond').innerText=second--;
}else{
document.getElementById('totalSecond').textContent=second--;
}
}
}
</script>