Javascript grundlegende Fragen

[Tobias]

Hey Leute,

mit Javascript kenne ich mich nur ein bisschen aus.

Ich hatte gestern ein Telefongespräch mit einem Programmierer der mit ein paar Dinge gesagt hat die ich nicht richtig verstanden habe.

Der Programmierer hat wohl mit Hilfe von PHP serverseitig ein Javascript Array zusammengebaut. Ebenfalls per PHP wurde dieses Array in einen Javascript Block gepackt (das zwischen <script> und </script>). Siehe hierzu nachfolgender Beispiel-Code:

<script>
  array = [{
    'wert1': '1.00',
    'wert2': '2.00'
  }];
</script>

Schaue ich mir den Quellcode mit Hilfe von STRG+U an, so finde ich den obigen Java-Script Block (der zuvor severseitg mit Hilfe von PHP generiert wurde) seltsamerweise nicht.

Betätigte ich hingegen F12 (Entwicklertools von Firefox) und klicke ich anschließend auf Inspector, so finde ich den oben genannten Java-Script Block.

Wie kann es sein, dass ich den Java-Script Block über den Inspector der Firefox Entwicklertools finde über den Quellcode (STRG+U) hingegen nicht? Es handelt sich bei beiden Varianten doch um den gleichen Quellcode?

Im Beispielcode oben wurden den Variablen wert1 und wert2 die Werte 1.00 und 2.00 zugewiesen. Der Programierer meinte man muss in Javascript bei Zahlen immer einen . als Trenner verwenden. Man dürfte auf keinen Fall 1,00 oder 2,00 schreiben sondern muss immer 1.00 oder 2.00 schreiben. Stimmt das so bzw. warum darf man in Javascript bei Zahlen kein , verwenden?

Der Programmierer meinte wenn man statt eines . ein , verwendet dann führt das zu einem Javascript Fehler. Dieser Javascript Fehler wird dann in den Entwicklertools angezeigt. Könnt Ihr mir sagen wo genau in den Entwicklertools dieser Javascript Fehler angezeigt wird?

[Robert B.]

Moin Tobias,

Der Programmierer hat wohl mit Hilfe von PHP serverseitig ein Javascript Array zusammengebaut. Ebenfalls per PHP wurde dieses Array in einen Javascript Block gepackt (das zwischen <script> und </script>). Siehe hierzu nachfolgender Beispiel-Code:

<script>
  array = [{
    'wert1': '1.00',
    'wert2': '2.00'
  }];
</script>

Steht das genau so im HTML-Code oder wird das JavaScript-Array anders ins DOM geladen?

Wie kann es sein, dass ich den Java-Script Block über den Inspector der Firefox Entwicklertools finde über den Quellcode (STRG+U) hingegen nicht? Es handelt sich bei beiden Varianten doch um den gleichen Quellcode?

Nein. Die Quellcode-Ansicht zeigt dir den HTML-Code, wie er vom Server als HTML-Datei geladen worden ist. Der Inspektor der Entwicklertools zeigt dir den normalisierten HTML-Code des DOMs an – und das kann durch JavaScript-Eingriff anders aussehen.

Im Beispielcode oben wurden den Variablen wert1 und wert2 die Werte 1.00 und 2.00 zugewiesen. Der Programierer meinte man muss in Javascript bei Zahlen immer einen . als Trenner verwenden.

In deinem Beispiel sehe ich keine Zahlen, sondern Strings. Unabhängig davon verwendet JavaScript tatsächlich den Punkt als Dezimaltrenner – wie es in vielen Locales der Welt üblich ist.

Der Programmierer meinte wenn man statt eines . ein , verwendet dann führt das zu einem Javascript Fehler. Dieser Javascript Fehler wird dann in den Entwicklertools angezeigt. Könnt Ihr mir sagen wo genau in den Entwicklertools dieser Javascript Fehler angezeigt wird?

In der Konsole sind Skriptfehler zu finden. Und der Programmierer hat Recht, denn das Komma hat in JavaScript eine andere Bedeutung, das siehst du in deinem Code-Beispiel.

Viele Grüße
Robert

[Gunnar Bittersmann]

@@Robert B.

Punkt als Dezimaltrenner – wie es in vielen Locales der Welt üblich ist.

Siehe Punkt-Länder und Komma-Länder.

LLAP 🖖

[Robert B.]

Hallo @Gunnar Bittersmann,

was macht eigentlich der Rest der Welt? 😉

Viele Grüße
Robert

[Tobias]

Wie kann es sein, dass ich den Java-Script Block über den Inspector der Firefox Entwicklertools finde über den Quellcode (STRG+U) hingegen nicht? Es handelt sich bei beiden Varianten doch um den gleichen Quellcode?

Nein. Die Quellcode-Ansicht zeigt dir den HTML-Code, wie er vom Server als HTML-Datei geladen worden ist. Der Inspektor der Entwicklertools zeigt dir den normalisierten HTML-Code des DOMs an – und das kann durch JavaScript-Eingriff anders aussehen.

Das heißt es gibt folgende Möglichkeiten, warum der Javascript-Code nicht mit STRG+U zu finden ist?

• Der Javascript Code liegt in einer externen Datei
• Der Javascript Code wird erst später per Javascript in den DOM reingeladen

Was meinst du mit normalisiert? Das es schön eingerückt dargestellt wird?

Ich habe bemerkt, dass der Quellcode in diesem DOM viel übersichtlicher angezeigt wird. Demnach sollte ich zukünftig wohl nur noch in den DOM schauen und die Quellcode Ansicht mit STRG+U komplett vergessen? Im DOM ist das Lesen des Codes ja viele einfacher.

[dedlfix]

Tach!

Ich habe bemerkt, dass der Quellcode in diesem DOM viel übersichtlicher angezeigt wird. Demnach sollte ich zukünftig wohl nur noch in den DOM schauen und die Quellcode Ansicht mit STRG+U komplett vergessen? Im DOM ist das Lesen des Codes ja viele einfacher.

Zumindest wenn es darum geht, das was im Browser abgeht zu verstehen. Das DOM ist aber nicht nur eine formatierte und mit einer Menge Bedienhilfen wie Aus- und Einklappen versehene andere Darstellungsform, sondern das, was der Browser aus dem Code interpretiert hat. Und das gegebenenfalls zuzüglich Fehlerkorrektur. Meist reicht das DOM, aber nicht immer. Der Blick in den Code bleibt dir nicht immer erspart. Man sollte ihn also auch trotz der Möglichkeiten der DOM-Ansicht einigermaßen lesbar erzeugen.

dedlfix.

[Tobias]

Meist reicht das DOM, aber nicht immer. Der Blick in den Code bleibt dir nicht immer erspart. Man sollte ihn also auch trotz der Möglichkeiten der DOM-Ansicht einigermaßen lesbar erzeugen.

Wann z.B. würde der Blick in den DOM denn nicht ausreichen?

[dedlfix]

Tach!

Meist reicht das DOM, aber nicht immer. Der Blick in den Code bleibt dir nicht immer erspart. Man sollte ihn also auch trotz der Möglichkeiten der DOM-Ansicht einigermaßen lesbar erzeugen.

Wann z.B. würde der Blick in den DOM denn nicht ausreichen?

Wenn du die Ursache für den Fehler im DOM finden möchtest. "Fehler" in dem Sinne, dass da was anderes rauskommt, als du dir vorgestellt hast. Unzulässige Schachtelungen wie diese <p><table>...</table></p> sehen im DOM anders aus als im Quelltext.

dedlfix.

[Robert B.]

Hallo Tobias,

Das heißt es gibt folgende Möglichkeiten, warum der Javascript-Code nicht mit STRG+U zu finden ist?

• Der Javascript Code liegt in einer externen Datei
• Der Javascript Code wird erst später per Javascript in den DOM reingeladen

Es gibt sogar noch (mindestens) eine weitere Möglichkeit: vorhandenes JavaScript generiert anderen Code.

Was meinst du mit normalisiert? Das es schön eingerückt dargestellt wird?

Mit normalisiert meine ich, dass der „Code“ im Inspektor vollständig ist, d.h. z.B. wenn ich im HTML-Code einen schließenden Tag vergesse, wird er vom Browser vervollständigt und im Inspektor angezeigt. Eventuell werden auch benötigte Attribute ergänzt oder Ähnliches.

Ich habe bemerkt, dass der Quellcode in diesem DOM viel übersichtlicher angezeigt wird. Demnach sollte ich zukünftig wohl nur noch in den DOM schauen und die Quellcode Ansicht mit STRG+U komplett vergessen?

Wenn im DOM etwas nicht stimmt, bleibt dir nichts Anderes übrig als in den Quellcode zu schauen um zu verstehen, was die Ursache für den Unterschied ist.

Viele Grüße
Robert

[Gunnar Bittersmann]

@@Robert B.

d.h. z.B. wenn ich im HTML-Code einen schließenden Tag vergesse, wird er vom Browser vervollständigt und im Inspektor angezeigt.

Dasselbe bei öffnenden Tags.

Und statt „vergesse“ besser „weglasse“. Bei etlichen Elementen sind öffnende bzw. schließende Tags optional.

Bsp.:

<table>
	<tr>
		<td>foo

generiert

<table>
	<tbody>
		<tr>
			<td>foo</td>
		</tr>
	</tbody>
</table>

LLAP 🖖

[Tobias]

Kann man eigentlich Quellcode aus dem DOM in einen Editor kopieren oder geht das nicht?

[JürgenB]

Hallo,

Strg A Strg C

-> Editor

Strg V

Gruß
Jürgen

[Gunnar Bittersmann]

@@Tobias

Kann man eigentlich Quellcode aus dem DOM in einen Editor kopieren oder geht das nicht?

Es gibt keinen Quellcode aus dem DOM. Das DOM (M steht für Modell) ist das, was generiert wird:

1. aus dem Quellcode (HTML, SVG, …)
2. durch clientseitiges Scripting (JavaScript)

Das DOM befindet sich im Speicher des Computers.

Entwicklerwerkzeuge stellen das DOM in einer Momentaufnahme so dar, als wäre es allein durch statisches HTML erzeugt worden.

Wenn du im Entwicklerwerkzeug auf „HTML bearbeiten“ gehst, bekommst du ein Editor-Feld, aus dem du diese Repräsentation herauskopieren kannst.

LLAP 🖖

[Gunnar Bittersmann]

@@Tobias

Wie kann es sein, dass ich den Java-Script Block über den Inspector der Firefox Entwicklertools finde über den Quellcode (STRG+U) hingegen nicht? Es handelt sich bei beiden Varianten doch um den gleichen Quellcode?

Kann ich ohne Kenntnis der Seite nichts zu sagen.

<script>
  array = [{
    'wert1': '1.00',
    'wert2': '2.00'
  }];
</script>

Im Beispielcode oben wurden den Variablen wert1 und wert2 die Werte 1.00 und 2.00 zugewiesen.

Nein. Im Beispielcode oben wurde der Variablen array der Wert [{'wert1': '1.00', 'wert2': '2.00'}] zugewiesen, nicht mehr und nicht weniger.

Das ist erstmal nur ein JSON-Objekt. Im Laufe der Verarbeitung können daraus Variablen wert1 und wert2 die Werte 1.00 und 2.00 zugewiesen werden.

Der Programierer meinte man muss in Javascript bei Zahlen immer einen . als Trenner verwenden. Man dürfte auf keinen Fall 1,00 oder 2,00 schreiben sondern muss immer 1.00 oder 2.00 schreiben. Stimmt das so

Nein, man darf auch 1 oder 2 schreiben – ganz ohne Dezimaltrenner. JavaScript ist nicht C.

bzw. warum darf man in Javascript bei Zahlen kein , verwenden?

Weil , in JavaScript ein Operator ist – der Komma-Operator.

Der Programmierer meinte wenn man statt eines . ein , verwendet dann führt das zu einem Javascript Fehler.

Nein, nicht unbedingt. Es führt aber zu einem völlig anderem Ergebnis:

1,414 + 1,732 ergibt: 732. Was passiert, ist:

1. Werte den Ausdruck vor dem ersten , aus: 1.
2. Werte den nächsten Ausdruck aus: 414 + 1 ergibt 415.
3. Werte den nächsten Ausdruck aus: 732.
4. Der zurückgegebene Wert ist der letzte, also 732.

Hingegen: 1.414 + 1.732 ergibt 3.146.

Dieser Javascript Fehler wird dann in den Entwicklertools angezeigt. Könnt Ihr mir sagen wo genau in den Entwicklertools dieser Javascript Fehler angezeigt wird?

Wenn es einen Fehler gibt, dann steht der unter „Konsole“.

LLAP 🖖

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Nanu, ich hatte doch alles als {:.language-js} gekennzeichnet und vorhin war’s auch noch bunt.

@Christian Kruse, hat sich da was am Syntax-Highlighter geändert?

LLAP 🖖

[Christian Kruse]

Hallo Gunnar,

@Christian Kruse, hat sich da was am Syntax-Highlighter geändert?

Nein. Da muss was anderes kaputt sein.

LG,
CK

[Christian Kruse]

Hallo Christian,

@Christian Kruse, hat sich da was am Syntax-Highlighter geändert?

Nein. Da muss was anderes kaputt sein.

Hm. Vermutung: beim Patch eben hat die reload-Aktion nicht ausgereicht, es hätte ein restart sein müssen, weil ein paar Gems geupdatet wurden. Nach einem restart funktionierts wieder.

LG,
CK

[Rolf B]

Hallo Tobias,

der Browser hat zwei Meinungen zu "Quelltext!". Einmal das, was der Server gesendet hat. Zum anderen das, was aktuell das DOM bildet. Das DOM kann jederzeit per JavaScript verändert werden; man kann auch Script-Blöcke per JavaScript hinzufügen. Wenn der Script-Block aber bereits in der von PHP generierten HTTP-Antwort steht, solltest Du ihn per Strg+U auch finden können. Gibt es einen Link auf diese Seite? Oder versteckt sie sich in irgendeinem Intranet?

JavaScript Fehler sieht man übrigens im Konsole-Teil der Entwicklerwerkzeuge. Du musst etwas aufpassen, die Konsole wird nach einer Seitennavigation nicht gelöscht, du siehst also ggf. Fehler, die von der vorigen Seite stammen. Es gibt aber einen "Löschen" Knopf.

Das Thema "Dezimaltrennzeichen" muss man etwas differenzierter betrachten. In deinem Beispiel werden keine Zahlen übertragen, sondern Zeichenketten. Schauen wir uns mal was anderes an:

<script>
  array = [{
    'wert1': '1.00',
    'wert2': 2.00,
    'wert3': '3,00',
    'wert4': 4,00
  }];
</script>

Das ist ein Array mit einem Eintrag. Dieser Eintrag ist ein Objekt mit 4 Eigenschaften - wert1, wert2, wert3 und wert4. Eigenschaftennamen müssen in normalem JavaScript nicht in Anführungszeichen oder Hochkomma stehen, das ist nur in einem JSON-String zwingend. In normalem JavaScript stört es aber auch nicht.

Die Eigenschaft wert1 bekommt eine Zeichenkette als Wert. Ob diese Zeichenkette nun eine Zahl darstellt, ob da ein Dezimalkomma drin steht oder ein Dezimalpunkt, das ist JavaScript total egal. Deswegen funktioniert aus Sicht von JS wert1 genausogut wie wert3.

Bei wert2 und wert4 liegt die Sache anders. Hier steht der Wert nicht in Anführungszeichen, d.h. wir haben nun aus Sicht des JavaScript-Interpreters eine Fließkommazahl vorliegen, und die muss den JavaScript-Regeln für Fließkommazahlen genügen. Und das heißt: DezimalPUNKT. Das Komma, bei wert4, hat eine andere Bedeutung. Welche genau, hängt vom Kontext ab. Hier ist es ein Objekt-Literal und das Komma würde zu einer weiteren Eigenschaft überleiten. Für die fehlt dann aber ein erlaubter Eigenschaftenname und der Doppelpunkt, und JavaScript wird entsprechend herummaulen. Es mault aber erst wegen wert4. Wert2 ist in Ordnung, und wert3 auch.

Aber: Es kann natürlich Folgefehler geben, wenn man einen String wie '2,15' später als Zahl weiterverwenden will. Das hängt vom Gesamtkunstwerk ab, in dem dieser Ablauf eingebettet ist. Es gibt aber durchaus Möglichkeiten, so etwas zu lösen. Wenn man bspw. mit parseFloat aus '2,15' die Javascript-Fließkommazahl 2.15 machen will, kann man mit der replace-Funktion erstmal aus dem Komma einen Punkt machen. Wenn man '2,15' an PHP zurückgibt und der Wert dort als 2.15 verarbeitet werden soll, muss das auf der PHP Seite geschehen.

Wenn man keinen Internet Explorer vor Version 11 unterstützen muss, kann man auch die locale-Eigenschaften der Number-Klasse in JavaScript nutzen, um Zahlen abhängig vom kulturellen Kontext des Anwenders korrekt zwischen interner (als float-Wert) und externer (als string) Darstellung umzuwandeln. Einen ZWANG, dem User Zahlen mit Dezimalpunkt zu präsentieren, gibt es nicht. Nur die damit verbundene Arbeit für den Programmierer. Ob dein Programmierer nun faul war, oder unwissend, kannst nur du wissen.

Rolf

[dedlfix]

Tach!

Schaue ich mir den Quellcode mit Hilfe von STRG+U an, so finde ich den obigen Java-Script Block (der zuvor severseitg mit Hilfe von PHP generiert wurde) seltsamerweise nicht.

Betätigte ich hingegen F12 (Entwicklertools von Firefox) und klicke ich anschließend auf Inspector, so finde ich den oben genannten Java-Script Block.

Mit F12 siehst du das DOM, das aus dem ausgelieferten Code generiert wurde, zuzüglich dessen, was zur Laufzeit an ihm (dem DOM) verändert wurde. Wenn der Javascript-Code indirekt über eine weitere Ressource eingebunden wurde, siehst du das im Quelltext nur anhand der Verlinkung der Ressource, also script-Elemente mit src-Attribut beispielsweise. Die darin angegebene Adresse kann man üblicherweise anklicken und bekommt dann deren Inhalt zu sehen.

Der Programierer meinte man muss in Javascript bei Zahlen immer einen . als Trenner verwenden. Man dürfte auf keinen Fall 1,00 oder 2,00 schreiben sondern muss immer 1.00 oder 2.00 schreiben. Stimmt das so bzw. warum darf man in Javascript bei Zahlen kein , verwenden?

Ja, die Schreibweise von Literalen im Code - also wie bestimmte Dinge, in dem Fall Zahlen, darzustellen sind - legt die Programmiersprache fest. Unabhängig davon ist, was der Anwender eingeben muss. Das muss dann gegebenenfalls zur Verarbeitung umgewandelt werden, und rückwärts, wenn es wieder auf den Bildschirm soll.

Der Programmierer meinte wenn man statt eines . ein , verwendet dann führt das zu einem Javascript Fehler. Dieser Javascript Fehler wird dann in den Entwicklertools angezeigt. Könnt Ihr mir sagen wo genau in den Entwicklertools dieser Javascript Fehler angezeigt wird?

Da gibt es einen Tab, der mit Console oder beschriftet ist.

dedlfix.

[TS]

Hello,

der JavaScript-Block wird vermutlich on-the-fly erzeugt, indem vom Server eine Datei nachgeladen wird

<script src="script1.js"></script>

die z.B. von PHP erzeugt wird.

Die muss auch nicht "*.php" heißen, wenn der Server entsprechend konfiguriert ist.

Liebe Grüße
Tom S.

[Tobias]

Hallo,

ein Bekannter von mir schreibt folgendes:

Wenn das Event nicht bis an die Spitze des DOMs durchgereicht wird, kriegt das System davon nichts mit.

Könnt Ihr mir verraten, was er mit dem Durchreichen eines Events bis an die DOM Spitze meint? Ich verstehe den Hintergrund nicht. Traue mich nicht bei ihm nachzufragen.

[Tabellenkalk]

Hallo,

Könnt Ihr mir verraten, was er mit dem Durchreichen eines Events bis an die DOM Spitze meint?

Damit ist das Bubbling gemeint.

Gruß
Kalk

[Gunnar Bittersmann]

@@Tabellenkalk

Damit ist das Bubbling gemeint.

Hach, dacht’ ich’s mir doch, dass der Abschnitt eine ID hat. Ist nur mit dem Smartphone schwerlich herauszufinden.

Hm, ich hätte einmal raten können. Der erste Versuch wäre ein Treffer gewesen. 😏

LLAP 🖖

[Tabellenkalk]

Hallo,

Hm, ich hätte …

<loddar>hätte, hätte, Fahrradmähre!</loddar>

Gruß
Kalk

[TS]

Hello,

Hach, dacht’ ich’s mir doch, dass der Abschnitt eine ID hat. Ist nur mit dem Smartphone schwerlich herauszufinden.

Das ist ein generelles Manquo von Browsern, das mich schon lange ärgert.
Vielleicht könnte man bei den Herstellern ja mal anregen, die ID eines Elements, sofern vorhanden, ins Kontextmenu mit "url mit ID kopieren" einzubauen.

Leider weiß ich nicht, wen ich da ansprechen müsste. Aber Du hast doch sicher den einen oder anderen Kontakt, bei dem Du das fallen lassen könntest?

Liebe Grüße
Tom S.

[Gunnar Bittersmann]

@@TS

Vielleicht könnte man bei den Herstellern ja mal anregen, die ID eines Elements, sofern vorhanden, ins Kontextmenu mit "url mit ID kopieren" einzubauen.

Wie soll das funktionieren? Auf dem Smartphone hat man beim Markieren von Text (eines Elements) schon das Kopieren des Inhalts im Angebot. Wie willst du da noch Kopieren des URLs mit Anker unterbringen – so, dass Ottonormalnutzer überhaupt versteht, worum es da geht?

Auf dem Desktop besteht das Problem nicht; da kann man mit dem Entwicklerwerkzeug leicht herausfinden, ob ein Element eine ID hat. Und diejenigen, die das Entwicklerwerkzeug ihres Browsers nicht kennen, wissen vermutlich auch nicht, warum sie nach einer ID Ausschau halten sollten.

LLAP 🖖

[TS]

Hello,

Wie soll das funktionieren?

genauso, wie bei echten Links. Da gibt es ja auch ein Kontextmenu, dass "URL kopieren" und "Text kopieren", usw. enthält. Wieso sollte das dann bei markiertem Text (ohne <a href"...">) nicht auch gehen?

Wer etwas will, findet Wege, wer etwas nicht will, Gründe...

Liebe Grüße
Tom S.

[Gunnar Bittersmann]

@@TS

Wie soll das funktionieren?

genauso, wie bei echten Links. Da gibt es ja auch ein Kontextmenu, dass "URL kopieren" und "Text kopieren", usw. enthält. Wieso sollte das dann bei markiertem Text (ohne <a href"...">) nicht auch gehen?

Wer etwas will, findet Wege, wer etwas nicht will, Gründe...

Ein Feature macht nur Sinn, wenn es mehr(eren) nutzt als schadet.

Das sehe ich hier nicht. Eine Überschrift markieren auf gut Glück, ob sie vielleicht eine ID hat? Und wenn die Überschrift gar keine ID hat, sondern das umgebende Element (was section sein sollte)? Wie soll das gehen?

LLAP 🖖

[TS]

Hello,

genauso, wie bei echten Links. Da gibt es ja auch ein Kontextmenu, dass "URL kopieren" und "Text kopieren", usw. enthält. Wieso sollte das dann bei markiertem Text (ohne <a href"...">) nicht auch gehen?

Das sehe ich hier nicht. Eine Überschrift markieren auf gut Glück, ob sie vielleicht eine ID hat? Und wenn die Überschrift gar keine ID hat, sondern das umgebende Element (was section sein sollte)? Wie soll das gehen?

Da bist DU der Fachmann ;-)

Ich bin sicher, dass es eine Lösung geben würde.
Und wenn keine ID in der Nähe ist, wird die Option eben ausgegraut angezeigt.

Liebe Grüße
Tom S.

[Mitleser]

genauso, wie bei echten Links. Da gibt es ja auch ein Kontextmenu, dass "URL kopieren" und "Text kopieren", usw. enthält. Wieso sollte das dann bei markiertem Text (ohne <a href"...">) nicht auch gehen?

Technisch würde man da bestimmt eine Lösung finden, für den ein oder anderen sogar evtl. sinnvoll. Nur für die überwältigende Mehrheit der User verkomplizierst Du damit die UX dramatisch(tippen und halten ist als Wortmakierung etabliert), ohne das jemand kapiert, was das überhaupt soll.

Wer etwas will, findet Wege, wer etwas nicht will, Gründe...

Jo.

[Tobias]

Hi,

kann man irgendwie prüfen bzw. sicherstellen, dass das Bubbling bis hin zur Wurzel einwandfrei funktioniert?

Kann ich mit Hilfe der Browser Entwickler Tools irgendwie einsehen ob das Bubbling durch ein Fehler oder einen anderen Grund unterbrochen wird?

[Gunnar Bittersmann]

@@Tobias

Könnt Ihr mir verraten, was er mit dem Durchreichen eines Events bis an die DOM Spitze meint?

Siehe 3. Der Event-Fluss: Bubbling bei molily

LLAP 🖖

[Rolf B]

Hallo Tobias,

bubbling wurde ja schon erwähnt. Was nicht erwähnt wurde, ist, dass man da nicht zwingend etwas reichen muss. Das bubbling passiert bei vielen Events automatisch (-> bubbles Eigenschaft).

Das Gegenteil kann man tun: Das Blubberbläschen aufspießen und nicht weiter blubbern lassen (siehe stopPropagation- und stopImmediatePropagation-Methoden des Event-Objekts). Man kann es auch blubbern lassen, aber eine Stinkbombe mitgeben. Der Browser rümpft dann die Nase und tut nichts damit (preventDefault Methode).

Rolf