Heim > Artikel > Web-Frontend > [HTML] 5 Möglichkeiten, zu HTML-Seiten zu springen
Verzeichnisstruktur:
Inhaltsstruktur [-]
HTML-Implementierung
Javascript-Implementierung
kombinierte reziproke Javascript-Implementierung (IE)
Lösen Sie das Problem, dass Firefox innerText nicht unterstützt
Kombiniert die Javascript-Implementierung von Reciprocal (IE, Firefox)
Referenzartikel
Fünf Beispiele sind unten aufgeführt, um sie im Detail zu erläutern. Die Hauptfunktionen dieser Beispiele sind: Nach 5 Sekunden springen Sie automatisch zu Datei hello.html im selben Verzeichnis (ändern Sie sie entsprechend Ihren Anforderungen).
1) Implementierung von HTML
<head> <!-- 以下方式只是刷新不跳转到其他页面 --> <meta http-equiv="refresh" content="10"> <!-- 以下方式定时转到其他页面 --> <meta http-equiv="refresh" content="5;url=hello.html"> </head>
Vorteile: Einfach
Nachteile: Nicht verfügbar in Struts Kacheln Verwendung
2) Implementierung von Javascript
57916d668bd9fde2bda8a8d63055ad35 // 以下方式直接跳转window.location.href='hello.html';// 以下方式定时跳转setTimeout("javascript:location.href='hello.html'", 5000); 2cacc6d41bbb37262a98f745aa00fbf0
Vorteile: Flexibel, mit weiteren Funktionen kombinierbar
Nachteile: Beeinflussung durch verschiedene Browser
3 ) Kombiniert mit reziproker Javascript-Implementierung (IE)
7b27906f4f08ef4a2c36759443f86ada554bdf357c58b8a65c66d7c19c8e4d114 57916d668bd9fde2bda8a8d63055ad35 second ="redirect()", 1000=--(second<0) location.href='hello.html'2cacc6d41bbb37262a98f745aa00fbf0
Vorteile: benutzerfreundlicher
Nachteile: Firefox unterstützt nicht (Firefox unterstützt nicht die innerText-Attribute von span, p usw.)
3') JavaScript-Implementierung, die reziproke ( Firefox)
57916d668bd9fde2bda8a8d63055ad35 var second = document.getElementById('totalSecond').textContent; setInterval("redirect()", 1000); function redirect() { document.getElementById('totalSecond').textContent = --second; if (second < 0) location.href = 'hello.html'; } 2cacc6d41bbb37262a98f745aa00fbf0
4) Lösen Sie das Problem, dass Firefox innerText nicht unterstützt
7b27906f4f08ef4a2c36759443f86ada554bdf357c58b8a65c66d7c19c8e4d11457916d668bd9fde2bda8a8d63055ad35 if(navigator.appName.indexOf("Explorer") > -1){ document.getElementById('totalSecond').innerText = "my text innerText"; } else{ document.getElementById('totalSecond').textContent = "my text textContent"; } 2cacc6d41bbb37262a98f745aa00fbf0
5) Kombiniert mit reziproker Javascript-Implementierung (IE, Firefox)
7b27906f4f08ef4a2c36759443f86ada554bdf357c58b8a65c66d7c19c8e4d114 57916d668bd9fde2bda8a8d63055ad35 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 8207cfcd3817cc3a3cfbc225f03e6e03 -1) { document.getElementById('totalSecond').innerText = second--; } else { document.getElementById('totalSecond').textContent = second--; } } } 2cacc6d41bbb37262a98f745aa00fbf0
Weitere Artikel zu [HTML] 5 Möglichkeiten zum Springen von HTML-Seiten finden Sie auf der chinesischen PHP-Website!