JavaScript-Tutorium:Browser - Versionsgeschichte

Kowa am 13. Juni 2019 um 08:40 Uhr

2019-06-13T08:40:21Z

← Nächstältere Version		Version vom 13. Juni 2019, 08:40 Uhr
Zeile 1:		Zeile 1:
			{{TBD}}
	=Ziel=		=Ziel=

Lawrence: /* Timer */

2015-10-22T19:16:04Z

Timer

Änderungen zeigen

Lawrence am 22. Oktober 2015 um 19:13 Uhr

2015-10-22T19:13:22Z

← Nächstältere Version		Version vom 22. Oktober 2015, 19:13 Uhr
Zeile 1.095:		Zeile 1.095:

	Obwohl der Browser zwar noch CPU-Zeit zur Verfügung hat ist er fast nur damit beschäftigt die überfälligen Callbacks auszuführen.		Obwohl der Browser zwar noch CPU-Zeit zur Verfügung hat ist er fast nur damit beschäftigt die überfälligen Callbacks auszuführen.
	Aufgrund dessen ist es sinnvoller <code>~~setTimeout~~()</code> für wiederholende Aufgaben zu verwenden deren Dauer nicht exakt vorhersehbar ist.		Aufgrund dessen ist es sinnvoller <code>setInterval()</code> für wiederholende Aufgaben zu verwenden deren Dauer nicht exakt vorhersehbar ist.

	Aufgrund der vielen verschiedenen Aufgaben des JavaScript-Threads ist eine exakte Wartezeit bei Timern nicht garantiert.		Aufgrund der vielen verschiedenen Aufgaben des JavaScript-Threads ist eine exakte Wartezeit bei Timern nicht garantiert.

Lawrence: /* DOM Events */

2015-10-14T21:55:09Z

DOM Events

Änderungen zeigen

Lawrence: /* Document Object Model */

2015-10-14T21:54:39Z

Document Object Model

Änderungen zeigen

Lawrence: /* Einführung */

2015-10-14T21:54:05Z

Einführung

← Nächstältere Version		Version vom 14. Oktober 2015, 21:54 Uhr
Zeile 5:		Zeile 5:

	=Einführung=		=Einführung=


	==Native vs. Host==		==Native vs. Host==

	In einer JavaScript-Umgebung existieren ~~immer~~ zwei ~~unterschiedliche~~ Arten von ~~Objekten und Funktionen~~.
	'''Native Objekte''' werden von der ~~JavaScript-~~Engine ~~zur Verfügung gestellt~~ und sind durch den ECMAScript-Standard abgedeckt.		In einer JavaScript-Umgebung existieren zwei Arten von Objekte.
	'''Host-Objekte''' sind ~~hingegen~~ nicht ~~zwingend~~ standardisiert und werden von der Umgebung bereitgestellt.		'''Native Objekte''' werden von der Engine bereitgestellt und sind durch den ECMAScript-Standard abgedeckt.
	Im Browser handelt es sich bei Host-Objekten um Schnittstellen für den Zugriff auf den Browser ~~selbst~~ und externe Geräte.		'''Host-Objekte''' sind nicht immer standardisiert und werden von der Umgebung bereitgestellt.
			Im Browser handelt es sich bei Host-Objekten um Schnittstellen für den Zugriff auf den Browser und externe Geräte.


	==HTML5-Standard==		==HTML5-Standard==

	~~Das bedeuteut, dass obwohl die Sprache selbst dem ECMAScript-Standard folgt, musste man bis vor wenigen Jahren~~
	~~noch davon ausgehen dass sich die verfügbaren APIs je nach Browser sehr stark unterscheiden können.~~
	~~Durch die steigende Entwicklungsgeschwindigkeit der Browser-Hersteller und den allgemein akzeptierten~~
	~~[https://html.spec.whatwg.org/multipage/ HTML5-Standard] verbessert sich diese Situation jedoch zunehmend.~~

	Heutzutage kann man davon ausgehen, dass jeweils die neuesten Versionen von Firefox, Chrome ~~und Internet Explorer~~		Obwohl es den ECMAScript-Standard gibt, muss man davon ausgehen,
			dass sich die verfügbaren APIs von Browser zu Browser unterscheiden können.
			Durch die steigende Entwicklungsgeschwindigkeit der Browser-Hersteller und den
			[https://html.spec.whatwg.org/multipage/ HTML5-Standard] verbessert sich diese Situation.

			Heutzutage kann man davon ausgehen, dass jeweils die neuesten Versionen von Firefox und Chrome
	die DOM-API und viele der neu verfassten HTML5-APIs bereits standardkonform unterstützen.		die DOM-API und viele der neu verfassten HTML5-APIs bereits standardkonform unterstützen.


	==Inline Code vs. externe Dateien==		==Inline Code vs. externe Dateien==


	Eine im Browser angezeigte Web-Seite besteht meist aus HTML, CSS und JavaScript, wobei nur HTML zwingend verlangt ist.		Eine im Browser angezeigte Web-Seite besteht meist aus HTML, CSS und JavaScript, wobei nur HTML zwingend verlangt ist.
	Der JavaScript-Code kümmert sich normalerweise um die dynamischen Aspekte, wie Interaktionen und das Nachladen von Inhalten.		Der JavaScript-Code kümmert sich normalerweise um die dynamischen Aspekte, wie Interaktionen und das Nachladen von Inhalten.

	~~Beim Besuch einer Website lädt der Browser das HTML-Dokument unter der angegeben URL herunter und evaluiert es.~~
	~~Das Dokument enthält dann wiederum optional Verweise auf CSS-Dateien, Bilder, JavaScript-Dateien und andere Medien.~~
	~~Neben Verweisen auf externen JavaScript-Code kann das Dokument auch Inline-Code-Blöcke enthalten.~~
	~~Ob es sich um externe Dateien oder Inline-Code handelt wirkt sich auf die Ladezeiten und das Caching des Browser aus,~~
	~~die enthaltenen Anweisungen und Ausdrücke werden jedoch nicht davon beeinflusst.~~

	'''Anmerkung:'' Die Reihenfolge der eingebunden Code-Blöcke und angegebenen Dateiverweise ist ~~allerdings~~ wichtig,		Der Browser lädt ein HTML-Dokument unter der angegebenen URL herunter und evaluiert dieses.
			Das Dokument enthält optional Verweise auf CSS-Dateien, Bilder, JavaScript-Dateien und andere Medien.
			Neben Verweisen auf externen JavaScript-Code kann das Dokument auch Inline-Code enthalten.
			Ob es sich um externe Dateien oder Inline-Code handelt wirkt sich auf die Ladezeiten aus,
			der Code selbst wird davon nicht beeinflusst.


			'''Anmerkung:''' Die Reihenfolge der eingebunden Code-Blöcke und angegebenen Dateiverweise ist wichtig,
	da diese ebenso die Reihenfolge der Code-Ausführung darstellt.		da diese ebenso die Reihenfolge der Code-Ausführung darstellt.


	==JavaScript-Kontext==		==JavaScript-Kontext==

	~~Für jede geladene Web-Seite, unabhängig davon ob sie im separaten Fenster oder als ein weiterer Tab angezeigt wird,~~
	~~erzeugt der Browser einen separaten und isolierten JavaScript-Kontext, in dem der geladene Code ausgeführt wird.~~
	~~Das bedeutet dass alle Objekte und Funktionen nur so lange am Leben sind bis die Seite neu geladen oder verlassen wird.~~
	~~Ein Zugriff auf andere Seiten in anderen Fenstern oder Tabs ist aus Sicherheitsgründen nicht erlaubt.~~

			Für jede Web-Seite, unabhängig davon ob sie im separaten Fenster oder als Tab angezeigt wird,
			erzeugt der Browser einen separaten isolierten JavaScript-Kontext, in dem Code ausgeführt wird.
			Das bedeutet, dass alle Objekte und Funktionen nur so lange existieren bis die Seite neu geladen oder verlassen wird.
			Ein Zugriff auf andere Seiten ist aus Sicherheitsgründen nicht erlaubt.

	=Window=		=Window=

Lawrence: /* Timer */

2014-12-01T11:39:37Z

Timer

← Nächstältere Version		Version vom 1. Dezember 2014, 11:39 Uhr
Zeile 982:		Zeile 982:
	});		});
	</source>		</source>


	=Timer=		=Timer=

Lawrence: /* DOM Events */

2014-12-01T11:37:33Z

DOM Events

← Nächstältere Version		Version vom 1. Dezember 2014, 11:37 Uhr
Zeile 622:		Zeile 622:

	</source>		</source>


	=DOM Events=		=DOM Events=

Kowa: /* Wiederverwendung */

2014-11-24T11:20:08Z

Wiederverwendung

← Nächstältere Version		Version vom 24. November 2014, 11:20 Uhr
Zeile 935:		Zeile 935:

	Mithilfe von DOM Events kann auch ein genereller, wiederverwendbarer Event-Mechanismus für JavaScript implementiert werden.		Mithilfe von DOM Events kann auch ein genereller, wiederverwendbarer Event-Mechanismus für JavaScript implementiert werden.
	Dazu wird ein DOM-Element erzeugt welches als virtuelles Ereignisziel dient und nicht ins Dokument eingehängt wird.		Dazu wird ein DOM-Element erzeugt, welches als virtuelles Ereignisziel dient und nicht ins Dokument eingehängt wird.

	<source lang="javascript">		<source lang="javascript">

Lawrence: /* DOM Events */

2014-11-23T18:09:37Z

DOM Events

@@ Zeile 927: / Zeile 927: @@
 document.addEventListener('keyup', function(event) {
    console.log('Der Benutzer hat eine Taste losgelassen');
 });
 </source>