Heim > Web-Frontend > js-Tutorial > Die Rolle des Window-Objekts im Front-End-Feld

Die Rolle des Window-Objekts im Front-End-Feld

青灯夜游
Freigeben: 2019-11-26 17:24:47
nach vorne
1820 Leute haben es durchsucht

Die Rolle des Window-Objekts im Front-End-Feld

Spezielles Fenster

Erwähnungsfenster, im Web Seite Es kommt sehr häufig vor, beispielsweise so:

window.onload=function(){
//执行函数体
}
Nach dem Login kopieren

Dieser Code gibt an, was zu tun ist, wenn der Inhalt der Webseite geladen wird.

Im Bereich js hat das Fensterobjekt eine Doppelrolle. Es ist sowohl eine Schnittstelle für den Zugriff auf das Browserfenster als auch ein globales Objekt. [Verwandte Kursempfehlungen: JavaScript-Video-Tutorial]

Aus diesem Grund werden alle im globalen Bereich deklarierten Variablen und Funktionen zu Eigenschaften und Methoden des Fensterobjekts.

Zum Beispiel:

var age = 29;
function sayAge(){
    alert(this.age);
}
alert(window.age); //29
sayAge();         //29
window.sayAge();  //29
Nach dem Login kopieren

Aber die beiden sind nicht vollständig gleichwertig. Globale Variablen können nicht durch Löschen gelöscht werden, Eigenschaften, die direkt im Fenster definiert werden, jedoch.

Historisches Erbe

Frühe Webseiten verwendeten mehr Fenster und Rahmen und zeigten Inlays im selben Fenster an. Eine Reihe von Webseiten , sowie verschiedene Popup-Fenster wie Warnung, Bestätigung, Aufforderung usw. ermöglichen es Benutzern, Informationen einzugeben oder zu bestätigen. Mit der Entwicklung der Webentwicklungstechnologie und des Webdesigns sind sie jedoch schwer zu finden, also werden wir es tun Konzentrieren Sie sich hier nicht auf sie.

Standortobjekt

Grundlegende Eigenschaften

Standort ist eines der nützlichsten Stücklistenobjekte. Es stellt Informations- und Navigationsfunktionen für das im aktuellen Fenster geladene Dokument bereit. Seine Hauptverwendungen beziehen sich auf URLs:

● Hash: Gibt die Zeichen nach dem #-Symbol in der URL zurück, andernfalls wird leer zurückgegeben.

 ● host/hostname: Gibt den Servernamen oder die Portnummer zurück.

●href: Gibt die vollständige URL zurück

●Port: Gibt die angegebene Portnummer zurück

●Protokoll: Gibt das verwendete Protokoll zurück

●Suche: Zurückgeben die URL-Abfragezeichenfolge, also alles vom Anfang bis zum Ende des Fragezeichens

Standortoperation

Standort kann den Standort des Browsers auf viele Arten ändern Am häufigsten wird die Methode „assign()“ verwendet, zum Beispiel:

location.assign("http://www.baidu.com");
Nach dem Login kopieren

Dadurch wird sofort eine neue URL geöffnet und ein Datensatz zum Browserverlauf hinzugefügt. Die folgenden zwei Codezeilen sind äquivalent:

window.location = "http://www.baidu.com";
location.href = "http://www.baidu.com";
Nach dem Login kopieren

Am häufigsten ist location .href.

Natürlich kann das Ändern anderer Attribute auch die aktuell geladene Seite ändern. Nach dem Ändern der URL kann der Benutzer jedoch durch Klicken auf die Schaltfläche „Zurück“ zur vorherigen Seite navigieren , es gibt Wenn wir nicht möchten, dass dieser Vorgang ausgeführt wird, können wir die Methode replace () verwenden. Wie folgt:

location.replace("http://www.baidu.com");
Nach dem Login kopieren

Es erhält nur einen Parameter, die URL, zu der navigiert werden soll, und es wird kein Datensatz generiert und der Benutzer kann nicht zur vorherigen Seite zurückkehren.

Eine weitere positionsbezogene Methode ist reload(), was wörtlich das Neuladen der aktuellen Seite bedeutet, aber hier gibt es eine kleine Einschränkung: Wenn es sich nur um ein Neuladen ohne Parameter handelt, wird die Seite beim Neuladen aus dem Browser-Cache gestartet . Wenn Sie das Neuladen vom Server erzwingen, müssen Sie Parameter wie diesen übergeben:

location.reload(true);
Nach dem Login kopieren

history object

history Hält Aufzeichnungen über Benutzer Beim Surfen im Internet ist jedem Browserfenster und jeder Registerkarte ein eigenes Verlaufsobjekt zugeordnet, das einem bestimmten Fensterobjekt zugeordnet ist. Aus Sicherheitsgründen können Entwickler im Allgemeinen nicht wissen, welche Webseiten der Benutzer durchsucht hat, es gibt jedoch immer noch Möglichkeiten, die Vorwärts- und Rückwärtsfunktionen zu implementieren ist go(). Beispiel:

history.go(-1);
history.go(1);
Nach dem Login kopieren

Der Parameter ist nicht nur eine Zahl, sondern auch eine Zeichenfolge. Der Browser springt entweder vorwärts oder rückwärts zur ersten Position im Verlauf, die die Zeichenfolge enthält. Zum Beispiel

history.go("baidu.com");
Nach dem Login kopieren

Darüber hinaus gibt es weitere direkte Methoden back() und forward() zum Vorwärts- oder Rückwärtsbewegen.

Darüber hinaus verfügt der Verlauf auch über ein Längenattribut, das die Anzahl der historischen Datensätze speichert. Sie können es verwenden, wenn Sie feststellen möchten, ob der Benutzer Ihre Seite von Anfang an geöffnet hat.

if(history.length == 0){
    //干你想干的事
}
Nach dem Login kopieren

Das Verlaufsobjekt wird nicht besonders häufig verwendet, aber in einigen Spezialdesigns ist es dennoch erforderlich, es zur Lösung von Problemen anzufordern.

Zusammenfassung

Der Status des Fensterobjekts in der mobilen Internetwelle ist nicht mehr so ​​wichtig wie der der PC-Seite, und zwar beinhaltet mehr Funktionen und Erkennung. In einem Aspekt umfasst es mehr Interaktionen, während andere Aspekte durch benutzerdefinierten Code mit umfangreicheren Funktionen implementiert werden.

Trotzdem ist das Fensterobjekt nicht nur so einfach, es gibt auch ein wichtiges Navigatorobjekt, aber wenn es darum geht, gibt es eine Menge Inhalt, also werde ich es in einem separaten Teil mit Ihnen teilen Artikel später.

Dieser Artikel stammt aus der Spalte JS-Tutorial, willkommen zum Lernen!

Das obige ist der detaillierte Inhalt vonDie Rolle des Window-Objekts im Front-End-Feld. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:ideazhao
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage