Detaillierte Erläuterung des Beispielcodes für ein JavaScript-Browserobjekt

JavaScript kann viele vom Browser bereitgestellte Objekte abrufen und Vorgänge ausführen. Dieser Artikel führt Sie in die relevanten Kenntnisse über Browserobjekte in JavaScript ein. Werfen wir einen Blick darauf.

JavaScript kann viele vom Browser bereitgestellte Objekte abrufen und bedienen.

window

Das Fensterobjekt fungiert nicht nur als globaler Bereich, sondern repräsentiert auch das Browserfenster.

Das Fensterobjekt verfügt über die Eigenschaften innerWidth und innerHeight, mit denen die interne Breite und Höhe des Browserfensters ermittelt werden kann. Die interne Breite und Höhe bezieht sich auf die Nettobreite und -höhe, die zum Anzeigen der Webseite verwendet wird, nachdem Platzhalterelemente wie Menüleisten, Symbolleisten und Rahmen entfernt wurden.

Kompatibilität: IEb9333a54c71bb7c4fcc933ecfd74950fxxx6e916e0f7d1e588d4f442bf645aedb2f im HTML-Dokument gelesen, kann aber dynamisch geändert werden:

Bitte beachten Sie den Titel des Änderung des Browserfensters.

Um einen Knoten im DOM-Baum zu finden, müssen Sie die Suche vom Dokumentobjekt aus starten. Die am häufigsten verwendeten Suchvorgänge basieren auf ID und Tag-Name.

document.title = '努力学习JavaScript!';

Wir bereiten zunächst die HTML-Daten vor:

Verwenden Sie getElementById() und
getElementsByTagName

(), die vom Dokumentobjekt bereitgestellt werden, um einen DOM-Knoten abzurufen ID und Erhalt einer Reihe von DOM-Knoten entsprechend dem Tag-Namen:

<dl id="drink-menu" style="border:solid 1px #ccc;padding:6px;">
  <dt>摩卡</dt>
  <dd>热摩卡咖啡</dd>
  <dt>酸奶</dt>
  <dd>北京老酸奶</dd>
  <dt>果汁</dt>
  <dd>鲜榨苹果汁</dd>
</dl>

Mokka

Hot Mocha CoffeeYoghurtPeking Old Yoghurt

Juice

var menu = document.getElementById('drink-menu');
var drinks = document.getElementsByTagName('dt');
var i, s, menu, drinks;

menu = document.getElementById('drink-menu');
menu.tagName; // 'DL'

drinks = document.getElementsByTagName('dt');
s = '提供的饮料有:';
for (i=0; i<drinks.length; i++) {
  s = s + drinks[i].innerHTML + &#39;,&#39;;
}
alert(s);

Frisch gepresster Apfel Saft

Das Dokumentobjekt verfügt auch über ein Cookie-Attribut, das das Cookie der aktuellen Seite abrufen kann.

Cookie ist eine vom Server gesendete Schlüsselwertkennung. Da das HTTP-Protokoll zustandslos ist, kann der Server mithilfe von Cookies unterscheiden, welcher Benutzer die Anforderung gesendet hat. Wenn sich ein Benutzer erfolgreich anmeldet, sendet der Server ein Cookie an den Browser, z. B. user=ABC123XYZ (verschlüsselte Zeichenfolge)... Wenn der Browser anschließend die Website besucht, hängt er dieses Cookie an den Anforderungsheader an und die Der Server verwendet das Cookie, anhand dessen Benutzer unterschieden werden können.

Cookies können auch einige Einstellungen der Website speichern, wie z. B. die auf der Seite angezeigte Sprache usw.

JavaScript kann das Cookie der aktuellen Seite über document.cookie lesen:

Da JavaScript das Cookie der Seite lesen kann, werden in der Regel auch die Anmeldeinformationen des Benutzers gespeichert Cookie. Dies stellt ein großes Sicherheitsrisiko dar, da es erlaubt ist, JavaScript-Code von Drittanbietern in HTML-Seiten einzuführen:

Wenn das eingeführte JavaScript von Drittanbietern schädlichen Code enthält, www Die .com-Website erhält direkt die

Benutzeranmeldeinformationen

document.cookie; // 'v=123; remember=true; prefer=zh'

der Website www.example.com.

Um dieses Problem zu lösen, kann der Server beim Setzen von Cookies httpOnly verwenden. Cookies, die auf httpOnly gesetzt sind, werden von JavaScript nicht gelesen. Dieses Verhalten wird vom Browser implementiert. Alle gängigen Browser unterstützen die Option httpOnly, und IE unterstützt sie ab IE6 SP1.

Um die Sicherheit zu gewährleisten, sollte der Server beim Setzen von Cookies immer darauf bestehen, httpOnly zu verwenden.

history

history object speichert den Verlauf des Browsers, der back() des History-Objekts aufrufen kann oder vorwärts (), was dem Klicken des Benutzers auf die Schaltfläche „Zurück“ oder „Vorwärts“ des Browsers entspricht.

Bei diesem Objekt handelt es sich um ein historisches Legacy-Objekt. Aufgrund der umfangreichen Verwendung von AJAX und der Seiteninteraktion kann ein einfacher und grober Aufruf von „history.back()“ Benutzer sehr verärgern.

Wenn Anfänger mit dem Entwerfen von Webseiten beginnen, rufen sie gerne History.back() auf, wenn die Anmeldeseite erfolgreich angemeldet ist, und versuchen, vor der Anmeldung zur Seite zurückzukehren. Das ist ein falscher Ansatz.

Sie sollten das History-Objekt unter keinen Umständen verwenden.

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Beispielcodes für ein JavaScript-Browserobjekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!