[HTML] HTML ページにジャンプする 5 つの方法

高洛峰
リリース: 2017-02-16 14:44:45
オリジナル
2640 人が閲覧しました

ディレクトリ構造:

コンテンツ構造[-]

  1. html実装

  2. javascript実装

  3. と相互JavaScript実装(IE)

  4. 解決策 問題Firefox が innerText をサポートしていないこと

  5. 相互の JavaScript 実装と組み合わせた (IE、Firefox)

  6. 参考記事

これらの例を詳しく説明するために、以下に 5 つの例を示します主な機能は次のとおりです。5 秒後に、同じディレクトリ内の hello.html ファイルに自動的にジャンプします (必要に応じて変更します)。
1) htmlの実装

<head>
<!-- 以下方式只是刷新不跳转到其他页面 -->
<meta http-equiv="refresh" content="10">
<!-- 以下方式定时转到其他页面 -->
<meta http-equiv="refresh" content="5;url=hello.html"> 
</head>
ログイン後にコピー

利点: シンプル
欠点: Struts Tilesでは使用できません

2) JavaScriptの実装

<script language="javascript" type="text/javascript"> 
// 以下方式直接跳转window.location.href=&#39;hello.html&#39;;// 以下方式定时跳转setTimeout("javascript:location.href=&#39;hello.html&#39;", 5000); 
</script>
ログイン後にコピー

利点: 柔軟性があり、より多くの他の機能と組み合わせることができます
短所: 異なるブラウザの影響を受けます

3) JavaScript 相互実装 (IE) と組み合わせる

<span id="totalSecond">5</span>
<script language="javascript" type="text/javascript"> 
 second ="redirect()", 1000=--(second<0) location.href=&#39;hello.html&#39;</script>
ログイン後にコピー

長所: より人間的
欠点: firefox はサポートしていません (firefox は、span、p などの innerText 属性をサポートしていません)

3') と相互 JavaScript 実装 (firefox) の組み合わせ

<script language="javascript" type="text/javascript"> 
var second = document.getElementById(&#39;totalSecond&#39;).textContent; 
setInterval("redirect()", 1000); 
function redirect() 
{ 
document.getElementById(&#39;totalSecond&#39;).textContent = --second; 
if (second < 0) location.href = &#39;hello.html&#39;; 
} 
</script>
ログイン後にコピー

4) FirefoxがinnerTextをサポートしていない問題を解決

<span id="totalSecond">5</span><script language="javascript" type="text/javascript"> if(navigator.appName.indexOf("Explorer") > -1){ 
document.getElementById(&#39;totalSecond&#39;).innerText = "my text innerText"; 
} else{ 
document.getElementById(&#39;totalSecond&#39;).textContent = "my text textContent"; 
} 
</script>
ログイン後にコピー

5) reciprocalのJavaScript実装と組み合わせる(IE、Firefox)

<span id="totalSecond">5</span>
 <script language="javascript" type="text/javascript"> var second = document.getElementById(&#39;totalSecond&#39;).textContent; 
 
if (navigator.appName.indexOf("Explorer") > -1)  { 
    second = document.getElementById(&#39;totalSecond&#39;).innerText; 
} else { 
    second = document.getElementById(&#39;totalSecond&#39;).textContent; 
} 
 
setInterval("redirect()", 1000); 
function redirect() { 
if (second < 0) { 
    location.href = &#39;hello.html&#39;; 
} else { 
    if (navigator.appName.indexOf("Explorer") > -1) { 
        document.getElementById(&#39;totalSecond&#39;).innerText = second--; 
    } else { 
        document.getElementById(&#39;totalSecond&#39;).textContent = second--; 
    } 
} 
} 
</script>
ログイン後にコピー

もっと見るHTML】HTML ページ 5 つのジャンプ方法の関連記事は、PHP 中国語 Web サイトに注目してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート