我們在正常的網(wǎng)頁開發(fā)中往往一個頁面是不能滿足我們的需求的,所以我們就需要使用到多頁面來進行實現(xiàn)我們的功能,那么今天我們就來說說有關(guān)于:“css怎么跳轉(zhuǎn)頁面?”這個問題吧!下面是小編查詢和整理的相關(guān)內(nèi)容資料,希望對大家的學(xué)習(xí)和理解有所幫助!
1、html實現(xiàn)
代碼如下:
<head>
<!-- 以下方式只是刷新不跳轉(zhuǎn)到其他頁面 -->
<meta http-equiv="refresh" content="10">
<!-- 以下方式定時轉(zhuǎn)到其他頁面 -->
<meta http-equiv="refresh" content="5;url=hello.html">
</head>
對于這個方法我們實現(xiàn)會相對的比較簡單,但是不足的點就是 Struts Tiles 中無法使用。
2、JavaScript實現(xiàn)
代碼如下:
<script language="javascript" type="text/javascript">
// 以下方式直接跳轉(zhuǎn)
window.location.href='hello.html';
// 以下方式定時跳轉(zhuǎn)
setTimeout("javascript:location.href='hello.html'", 5000);
</script>
通過使用JavaScript這個方法,它是屬于比較靈活可以讓我們結(jié)合更多其他功能的,但是有不足的是會受到不同瀏覽器的影響。
3、在firefox中結(jié)合倒數(shù)JavaScript實現(xiàn)
代碼如下:
<script language="javascript" type="text/javascript">
var second = document.getElementById('totalSecond').textContent;
setInterval("redirect()", 1000);
function redirect()
{
document.getElementById('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.getElementById('totalSecond').innerText = "my text innerText";
} else{
document.getElementById('totalSecond').textContent = "my text textContent";
}
</script>
5、整合
<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript">
var second = document.getElementById('totalSecond').textContent;
if (navigator.appName.indexOf("Explorer") > -1) {
second = document.getElementById('totalSecond').innerText;
} else {
second = document.getElementById('totalSecond').textContent;
}
setInterval("redirect()", 1000);
function redirect() {
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>
小結(jié):以上的例子都是主要來實現(xiàn)在五秒之后自動跳轉(zhuǎn)到同一目錄下的 hello.html文件中。
總結(jié):
關(guān)于“css怎么跳轉(zhuǎn)頁面?”這個問題,今天我們也結(jié)束了介紹,如果你有其他的想法也可以分享你的看法和大家一同分享,更多有關(guān)于前端方面的知識我們都可以在W3Cschool中進行學(xué)習(xí)和了解。