首頁 web前端 html教學 HTML網頁自動跳轉的5種方法

HTML網頁自動跳轉的5種方法

Nov 10, 2020 pm 05:58 PM
html 網頁跳轉

HTML網頁自動跳轉的5種方法

(推薦教學:html教學

#在我們進行網站建立時常常會遇到需要進行網頁跳轉的情況,本文就來為大家介紹五種網頁自動跳轉的方法.有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

網頁自動跳到5種方法:

#第一種網頁自動跳轉方法:meta refresh自動跳轉法

在網頁的head區域的meta refresh標籤中,加入自動跳到程式碼,可實現網頁的立即或延遲自動跳轉。 

範例如下:

 <meta http-equiv="refresh" content="10;url= http://xfbbs.com/ ">
登入後複製

上述html程式碼中的「10」是延遲跳躍的時間,單位是秒。如果設為0,就表示立即跳轉。

http://xfbbs.com 」是跳轉的目標位址,可以是同一網域下的站內相對路徑,也可以是不同網域的站外位址。 

由於搜尋引擎能夠讀取html,所以對於這個自動跳轉方法,搜尋引擎是能夠自動偵測出來的。被視為作弊,則主要看跳轉時間。如果跳轉時間為0,就可能被視為作弊,從而受到懲罰。如果有時間延遲(一般3秒以上),就會被視為正常應用。

第二種網頁自動跳轉方法:body onload自動跳轉法

#在網頁載入時透過onload事件指定parent.location進行自動跳轉。 

範例如下:

 <body onload="parent.location=&#39; http://xfbbs.com&#39; ">
登入後複製

這個方法與第一種方法一樣,能夠被搜尋引擎辨識。

第三種網頁自動跳轉方法:javascript自動跳轉法

javascript可以實現網頁的自動跳轉,如果要實現立即跳轉,將跳轉代碼放在網頁的head區域即可。 

範例如下: 

<script language="javascript"> location.replace(" http://xfbbs.com/yule/tietu/ ") </script>
登入後複製

其中的「 http://xfbbs.com/yule/tietu/ 」是重新導向目標位址。

 由於搜尋引擎無法解析javascript,所以搜尋引擎便無法辨識出用javascript腳本進行的自動跳轉。

第四種網頁自動跳轉方法:表單自動跳轉法

#對於表單大家都很熟悉,就是將表單填寫的內容,提交到action在參數中指定的url位址中,目標url再對接收到的資料進行處理。利用這一點,我們可間接的實作網頁跳轉,只不過,我們並不需要提交任何表單內容。再結合javascript腳本,可以自動提交表單。

範例如下: 

<form name="form1" action= http://xfbbs.com/index.html method="get"> </form> 
<script language="javascript"> document.form1.submit() </script>
登入後複製

其中form1名稱任意,但二處form1應該統一。

action中的url位址必須以檔案名稱結尾,例如「action= http://xfbbs.com/ 」或「action= http://xfbbs.com /yule 」便是不規範寫法。 method可以是get也可以是post,但根據我的經驗,提交空表單時最好使用get。

 眾所周知,由於搜尋引擎的蜘蛛程式是不會填寫表單的,所以搜尋引擎便無法辨識透過此方法實現的網頁自動跳轉。

第五種網頁自動跳轉方法:程式跳轉法(response.redirectserver.transfer

每個程式都有各自的頁面跳轉方法,例如asp中使用response.redirect 來進行跳轉。

跳轉範例如下:

response.redirect " http://xfbbs.com "
登入後複製

它的作用是,asp程式執行到該行程式碼後,會立即跳到目標url位址中去。 

在asp中,除了使用response.redirect 做跳轉外,還有一個跳轉方法,用server.transfer進行跳轉。

跳轉範例如下: 

response.redirect "/yule/tietu/index.html"
登入後複製

注意,這裡的url位址,必須是站內位址,且url位址必須以檔案名稱結尾,例如:response.redirect "/yule /tietu/" 就是錯誤用法。

response.redirectserver.transfer都能實現網頁自動跳轉,但二者也有不同之處,前者可以跳到站內url,也可以跳到站外url,而後者只能跳到站內文件,且瀏覽器網址列的url將保持不變。

server.transfer還有許多好處,這裡不多詳述,大家可在搜尋引擎中找到它的更多資料。使用response.redirect 跳轉雖然是在伺服器端完成跳轉的,但它最終是轉換成html後在客戶端執行的,因此,也能被搜尋引擎識別,過多的使用亦會被當作作弊處理。

如果是在同一網站內部的不同網頁間跳轉,建議使用server.transfer跳轉,server.transfer肯定不會被搜尋引擎視為作弊。

更多程式相關知識,請造訪:程式設計影片! !

以上是HTML網頁自動跳轉的5種方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

HTML 中的表格邊框 HTML 中的表格邊框 Sep 04, 2024 pm 04:49 PM

HTML 表格邊框指南。在這裡,我們以 HTML 中的表格邊框為例,討論定義表格邊框的多種方法。

HTML 中的巢狀表 HTML 中的巢狀表 Sep 04, 2024 pm 04:49 PM

這是 HTML 中巢狀表的指南。這裡我們討論如何在表中建立表格以及對應的範例。

HTML 左邊距 HTML 左邊距 Sep 04, 2024 pm 04:48 PM

HTML 左邊距指南。在這裡,我們討論 HTML margin-left 的簡要概述及其範例及其程式碼實作。

HTML 表格佈局 HTML 表格佈局 Sep 04, 2024 pm 04:54 PM

HTML 表格佈局指南。在這裡,我們詳細討論 HTML 表格佈局的值以及範例和輸出。

HTML 輸入佔位符 HTML 輸入佔位符 Sep 04, 2024 pm 04:54 PM

HTML 輸入佔位符指南。在這裡,我們討論 HTML 輸入佔位符的範例以及程式碼和輸出。

HTML 有序列表 HTML 有序列表 Sep 04, 2024 pm 04:43 PM

HTML 有序列表指南。在這裡我們也分別討論了 HTML 有序列表和類型的介紹以及它們的範例

在 HTML 中移動文字 在 HTML 中移動文字 Sep 04, 2024 pm 04:45 PM

HTML 中的文字移動指南。在這裡我們討論一下marquee標籤如何使用語法和實作範例。

HTML onclick 按鈕 HTML onclick 按鈕 Sep 04, 2024 pm 04:49 PM

HTML onclick 按鈕指南。這裡我們分別討論它們的介紹、工作原理、範例以及各個事件中的onclick事件。

See all articles