前回の記事では、HTML ページが 3 秒後に自動的にジャンプする一般的な 3 つの方法を紹介しました。この記事では、引き続き HTML ページ ジャンプに関する関連知識を紹介します。一緒に学びましょう。 1) HTMLの実装 コードをコピー コードは次のとおりです。<ヘッド> <meta http-equiv="refresh" content="5;url=hello.html"> </head> 長所: シンプル デメリット: Struts Tilesでは使用できません 2) JavaScriptの実装 コードをコピー コードは次のとおりです。<mce:script language="javascript" type="text/javascript"><!-- タイムアウトを設定します("javascript:location.href='http://liting6680.blog.163.com/blog/hello.html'", 5000); // --></mce:script> 利点: 柔軟性があり、他の機能と組み合わせることができます デメリット: ブラウザによって影響される 3) カウントダウンJavaScript実装と組み合わせる(IE) コードをコピー コードは次のとおりです。<span id="totalSecond">5</span> <mce:script language="javascript" type="text/javascript"><!-- var 秒 = totalSecond.innerText; setInterval("リダイレクト()", 1000); 関数リダイレクト(){ totalSecond.innerText=--秒; if(second<0) location.href='http://liting6680.blog.163.com/blog/hello.html'; } // --></mce:script> 利点: より人道的 デメリット: Firefox はサポートしていません (Firefox は span、div などの innerText 属性をサポートしていません) 3) カウントダウンJavaScript実装と組み合わせる(Firefox) コードをコピー コードは次のとおりです。<mce:script language="javascript" type="text/javascript"><!-- var second = document.getElementById('totalSecond').textContent; setInterval("リダイレクト()", 1000); 関数リダイレクト() { document.getElementById('totalSecond').textContent = --秒; if (second < 0) location.href='http://liting6680.blog.163.com/blog/hello.html'; } // --></mce:script> 4) FirefoxがinnerTextをサポートしていない問題を解決する コードをコピー コードは次のとおりです。<span id="totalSecond">5</span> <mce:script language="javascript" type="text/javascript"><!-- if (navigator.appName.indexOf("Explorer") > -1) { document.getElementById('totalSecond').innerText = "私のテキストinnerText"; } それ以外{ document.getElementById('totalSecond').textContent = "私のテキストのtextContent"; } // --></mce:script> 5) 3)と3')の統合 コードをコピー コードは次のとおりです。<span id="totalSecond">5</span> <mce:script language="javascript" type="text/javascript"><!-- var second = document.getElementById('totalSecond').textContent; (navigator.appName.indexOf("Explorer") > -1 の場合) { 秒 = document.getElementById('totalSecond').innerText; } それ以外 { 秒 = document.getElementById('totalSecond').textContent; } setInterval("リダイレクト()", 1000); 関数リダイレクト() { (秒数 < 0)の場合 { 場所.href='http://liting6680.blog.163.com/blog/hello.html'; } それ以外 { (navigator.appName.indexOf("Explorer") > -1 の場合) { document.getElementById('totalSecond').innerText = 秒 --; } それ以外 { document.getElementById('totalSecond').textContent = 秒 --; } } } // --></mce:script> 上記の 5 つの例では、HTML を使用して自動ページ ジャンプを実現する 5 つの方法を紹介しています。気に入っていただければ幸いです。 |
<<: さまざまなReact状態マネージャーの解釈と使用方法
>>: JTAを実装するためにAtomikosと組み合わせたTomcatについて
この記事では、クリックして切り替える認証コードと認証を実装するためのJavaScriptの具体的なコ...
誰もが自分の Web ページの背景にふさわしい画像を見つけることに悩むことが多いと思います。これは事...
1. ツール今必要なツールは2つあります: MySQLサーバー (mysql-5.7.18)、MyS...
1. 要素の幅/高さ/パディング/マージンのパーセンテージ基準要素の幅/高さ/パディング/マージンの...
目次シナリオ効果コード要約するシナリオ登録ページに携帯電話番号を入力し、登録インターフェイスを要求す...
1: Baiduウェブサイトログイン入口ウェブサイト: http://www.baidu.com/s...
この記事は主に、MySQL インデックスの長さ制限の原理の分析を紹介します。サンプル コードを通じて...
この記事の例では、ボタンをクリックすることで画像を切り替えることを実現するJavaScriptの具体...
目次1. プロトタイプ(明示的なプロトタイプ) 2. __proto__ (暗黙のプロトタイプ) 3...
「キャンセル」ボタンは必要な操作プロセスの一部ではなく、デザイン上の主要な要素として表示されません...
JPQL は Java Persistence Query Language の略です。 Java ...
背景SQL クエリを実行するときに、where 条件の vachar 型フィールドの単一引用符を削除...
MySQL ロックの概要他のデータベースと比較すると、MySQL のロック メカニズムは比較的単純で...
この記事の例では、記事の折りたたみと展開の機能を実現するためのjQueryの具体的なコードを参考まで...
ウェブデザイナーを長い間悩ませてきた疑問があります。それは、固定レイアウト、流動的レイアウト、柔軟レ...