Fünf Möglichkeiten zum automatischen Seitensprung in HTML

Fünf Möglichkeiten zum automatischen Seitensprung in HTML

Im vorherigen Artikel haben wir drei gängige Methoden vorgestellt, mit denen HTML-Seiten nach 3 Sekunden automatisch springen können. Dieser Artikel wird Ihnen weiterhin das relevante Wissen über das Springen von HTML-Seiten vermitteln. Lassen Sie uns gemeinsam lernen.
Nachfolgend sind fünf Beispiele aufgeführt, die im Detail erläutert werden. Die Hauptfunktion dieser Beispiele ist: Nach 5 Sekunden wird automatisch zur Datei hello.html im selben Verzeichnis gesprungen (ändern Sie sie nach Bedarf).

1) Implementierung von HTML


Code kopieren
Der Code lautet wie folgt:

<Kopf>
<meta http-equiv="aktualisieren" content="5;url=hallo.html">
</Kopf>

Vorteile: Einfach

Nachteil: Kann nicht in Struts-Kacheln verwendet werden

2) Implementierung von JavaScript


Code kopieren
Der Code lautet wie folgt:

<mce:script language="javascript" type="text/javascript"><!--
setTimeout("javascript:location.href='http://liting6680.blog.163.com/blog/hello.html'", 5000);
// --></mce:Skript>

Vorteile: Flexibel, kombinierbar mit weiteren Funktionen

Nachteile: Von verschiedenen Browsern beeinflusst

3) Kombiniert mit der Countdown-Javascript-Implementierung (IE)


Code kopieren
Der Code lautet wie folgt:

<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
var Sekunde = Gesamtsekunde.innerText;
setInterval("umleiten()", 1000);
Funktion Umleitung () {
totalSecond.innerText=--Sekunde;
wenn (Sekunde < 0) Standort.href = "http://liting6680.blog.163.com/blog/hello.html";
}
// --></mce:Skript>

Vorteile: Humaner

Nachteile: Firefox unterstützt nicht (Firefox unterstützt nicht das innerText-Attribut von span, div usw.)

3) Kombiniert mit der Countdown-Javascript-Implementierung (Firefox)


Code kopieren
Der Code lautet wie folgt:

<mce:script language="javascript" type="text/javascript"><!--
var Sekunde = document.getElementById('totalSecond').textContent;
setInterval("umleiten()", 1000);
Funktion Umleitung ()
{
document.getElementById('totalSecond').textContent = --Sekunde;
wenn (Sekunde < 0) location.href='http://liting6680.blog.163.com/blog/hello.html';
}
// --></mce:Skript>

4) Lösen Sie das Problem, dass Firefox innerText nicht unterstützt


Code kopieren
Der Code lautet wie folgt:

<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
wenn (navigator.appName.indexOf("Explorer") > -1) {
document.getElementById('totalSecond').innerText = "mein Text innerText";
} anders{
document.getElementById('totalSecond').textContent = "mein Text textContent";
}
// --></mce:Skript>

5) Integration von 3) und 3')


Code kopieren
Der Code lautet wie folgt:

<span id="totalSecond">5</span>
<mce:script language="javascript" type="text/javascript"><!--
var Sekunde = document.getElementById('totalSecond').textContent;
wenn (navigator.appName.indexOf("Explorer") > -1)
{
Sekunde = document.getElementById('totalSecond').innerText;
} anders
{
Sekunde = document.getElementById('totalSecond').textContent;
}
setInterval("umleiten()", 1000);
Funktion Umleitung ()
{
wenn (Sekunde < 0)
{
Standort.href='http://liting6680.blog.163.com/blog/hallo.html';
} anders
{
wenn (navigator.appName.indexOf("Explorer") > -1)
{
document.getElementById('totalSecond').innerText = Sekunde--;
} anders
{
document.getElementById('totalSecond').textContent = Sekunde--;
}
}
}
// --></mce:Skript>

Die obigen fünf Beispiele stellen fünf Methoden vor, mit denen HTML automatisch zum Seitenwechsel verwendet werden kann. Ich hoffe, sie gefallen Ihnen.

<<:  Interpretation und Verwendung verschiedener React-State-Manager

>>:  Lösen Sie das Problem des MySql8.0-Prüfungsfehlers der Transaktionsisolationsebene

Artikel empfehlen

Neunundvierzig JavaScript-Tipps und Tricks

Inhaltsverzeichnis 1. Betrieb von js Integer 2. S...

Ein Blick auf toolbasierte Websites: die Definition von toolbasierten Websites und eine typische Fallanalyse (Bilder und Text)

Wenn es um Tool-Websites geht, haben wir zunächst...

Detaillierte Erläuterung der Redis-Master-Slave-Replikationspraxis mit Docker

Inhaltsverzeichnis 1. Hintergrund 2. Bedienungssc...

TypeScript-Aufzählungstypen im Detail erklären

Inhaltsverzeichnis 1. Digitale Aufzählung 2. Zeic...

Eine kurze Analyse von MySQL-Verbindungen und -Sammlungen

Join-Abfrage Eine Join-Abfrage bezieht sich auf e...

MySQL 8.0.12 Installations- und Konfigurations-Tutorial

Dieser Artikel enthält das ausführliche Tutorial ...

So ändern Sie die Master-Slave-Replikationsoptionen in MySQL online

Vorwort: Die am häufigsten verwendete Architektur...

So installieren Sie Nginx in Docker

Installieren Sie Nginx auf Docker Nginx ist ein l...

Die Hook-Funktion von Vue-Router implementiert Routing Guard

Inhaltsverzeichnis Überblick Globale Hook-Funktio...

JavaScript zum Erzielen eines Fortschrittsbalkeneffekts

In diesem Artikelbeispiel wird der spezifische Ja...

Detaillierter Code zum Erstellen eines Mehrpersonen-Video-Chat-Dienstes basierend auf WebRTC unter Ubuntu

WebRTC steht für Web Real-Time Communication und ...

Konfigurationsprozess für die MySQL-Master-Slave-Replikation

Konfiguration der Hauptbibliothek 1. Konfiguriere...

Implementierungsmethode des Nginx+Tomcat-Lastausgleichsclusters

Die experimentelle Umgebung ist wie folgt Hier mü...

Der Unterschied zwischen absolutem und relativem Pfad bei der Webseitenerstellung

1. Absoluter Pfad Zunächst einmal bezieht sich de...

Detaillierte Erläuterung der praktischen Anwendung des HTML-Tabellenlayouts

Wann wird die Tabelle eingesetzt? Tabellen werden...