JavaScript BOM erklärt

Inhaltsverzeichnis

1. BOM-Einführung

1. JavaScript besteht aus drei Teilen
2.Fensterobjekt
3.Standortobjekt
4.History-Objekt

Zusammenfassen

1. BOM-Einführung

1. JavaScript besteht aus drei Teilen

ECMAScript-Kernsyntax ES
DOM-Dokumentobjektmodell, das Kernobjekt ist das Dokument, das zum Bedienen von Seitendokumenten verwendet wird
BOM-Browserobjektmodell, das Kernobjekt ist das Fenster, das zum Bedienen des Browsers verwendet wird

Bildbeschreibung hier einfügen

2.Fensterobjekt

Name	Bedeutung
Geschichte	Informationen über vom Client besuchte URLs
Standort	Informationen zur aktuellen URL, Child-DOM-Objekten
dokumentieren	Stellt das HTML-Dokument des Browserfensters dar, ein DOM-Objekt auf Wortebene

Gängige Methoden:

Methodenname	Bedeutung
Alarm (Text)	Zeigt ein Warnfeld mit einer Eingabeaufforderung und einer OK-Schaltfläche an.
Eingabeaufforderung (Text)	Zeigt ein Eingabefeld mit einer Eingabeaufforderung, einem Texteingabefeld sowie den Schaltflächen „OK“ und „Abbrechen“ an.
bestätigen(Text)	Zeigt ein Bestätigungsfeld mit Eingabeaufforderungsinformationen sowie den Schaltflächen „OK“ und „Abbrechen“ an. „Bestätigung“ gibt „true“ zurück, „Abbrechen“ gibt „false“ zurück.
öffnen(URL,Name,Optionen)	Öffnet ein neues Fenster mit dem angegebenen Namen und lädt das durch die angegebene URL angegebene Dokument.
setTimeout(fn,Verzögerung)	Stellen Sie einen einmaligen Timer ein, um eine Funktion nach einer bestimmten Anzahl von Millisekunden auszuführen
setzeIntervall(fn,Verzögerung)	Stellen Sie einen periodischen Timer ein, um eine Funktion regelmäßig auszuführen
cleatTimeout(Zeitgeber)	Einmal-Timer löschen
cleanInterval(Zeitgeber)	Einmal-Timer löschen
scrollTo(xpos,ypos)	Scrollen Sie den Inhalt zu den angegebenen Koordinaten, d. h. legen Sie die Versatzposition der Bildlaufleiste fest
scrollBy(xnum,ynum)	Scrollen Sie den Inhalt um die angegebene Anzahl von Pixeln, d. h. legen Sie den Versatz der Bildlaufleiste fest

open Öffnet das angegebene Fenster

<Skript>
        Funktion f1() {
            //Dies ist kein CSS-Stil, die Größe des geöffneten Fensters kann angepasst werden open('test.html', 'user', 'width=500px,height=500px')
        }
    </Skript>
</Kopf>
<Text>
    <button onclick="f1()">Neues Fenster öffnen</button>
</body>

setTimeout(fn,delay)

  <Skript>
        Funktion f1() {
            //Dies ist kein CSS-Stil, die Größe des geöffneten Fensters kann angepasst werden open('test.html', 'user', 'width=500px,height=500px')
        }
        Funktion f2() {
            setTimeout(f1, 2000)
        }
    </Skript>
</Kopf>
<Text>
    <button onclick="f2()">Einmaliger Timer</button>
</body>

cleatTimeout(timer)

Schalten Sie einen einmaligen Timer innerhalb des Zeitrahmens aus, der nicht ausgeführt wurde

```Javascript
<Skript>
        Funktion f1() {
            //Dies ist kein CSS-Stil, die Größe des geöffneten Fensters kann angepasst werden open('test.html', 'user', 'width=500px,height=500px')
        }
    </Skript>
</Kopf>
<Text>
    <button onclick="f1()">Neues Fenster öffnen</button>
</body>

setTimeout(fn,delay)

  <Skript>
        Funktion f1() {
            //Dies ist kein CSS-Stil, die Größe des geöffneten Fensters kann angepasst werden open('test.html', 'user', 'width=500px,height=500px')
        }
        Var-Zeitgeber
        Funktion f2() {
            Timer = setzeTimeout(f1, 2000)
        }
        Funktion f3(){
		Zeitgeber löschen(Zeitgeber)
}
    </Skript>
</Kopf>
<Text>
    <button onclick="f2()">Einmaliger Timer</button>
    <button onclick="f3()">Deaktiviere den One-Shot-Timer</button>
</body>

scrollTo(xpos,ypos)

Zur angegebenen Position bewegen

<Skript>
        Funktion f1() {
            scrollTo(0, 100) //Einheit ist px
        }
    </Skript>

Häufige Ereignisse

Uhrzeit Name	Bedeutung
beim Klicken	Mausklicks
laden	Seite wurde geladen
weiterscrollen	Schieberegler für die Fenster-Bildlaufleiste

Hinweis: Da das Fensterobjekt das oberste Objekt der BOM-Struktur ist, kann das Fenster beim Aufruf von Fenstereigenschaften und -methoden weggelassen werden.

<Skript>
//Nach dem Klicken auf das Fenster ausführen window.onclick = function() {
            konsole.log(111)
        }
    </Skript>

3.Standortobjekt

Gemeinsame Eigenschaften

href setzt oder gibt die URL in der Adressleiste zurück

Die allgemeine Methode reload() lädt die aktuelle Seite neu

    <Skript>
        Funktion getUrl() {
            // Holen Sie sich die URL in der Adressleiste
            konsole.log(Standort.href)
                //Legen Sie die URL in der Adressleiste fest, um die Seite weiterzuleiten. //Standort = 'https://www.baidu.com'
            location.href = "https://www.baidu.com"
            //Seite neu laden location.reload();
        }
    </Skript>
</Kopf>
<Text>
    <button onclick="getUrl()">URL abrufen</button>
</body>

4.History-Objekt

Methodenname	Bedeutung
zurück()	Gehen Sie zurück und laden Sie die vorherige URL in der Verlaufsliste
Vorwort()	Gehen Sie weiter und laden Sie die nächste URL in der Verlaufsliste
gehe(Zahl)	Der Browser verschiebt die angegebene Anzahl Seiten

  <Skript>
        Funktion goBack() {
            Geschichte.zurück()
        }
        Funktion gehe vorwärts() {
            Geschichte.vorwärts()
        }
        Funktion goGo() {
            history.go(1) //Gehe einen Schritt vorwärts }
    </Skript>
</Kopf>
<Text>
    <button onclick="goBack()">Zurück</button>
    <button onclick="goforward()">Weiter</button>
</body>