Ich versuche den Lebenszyklus einer HTML-Seite zu verstehen. Ich kann online keine guten Ressourcen finden. Also habe ich das f12-Tool in ie geöffnet und selbst einige Experimente gemacht. Darauf aufbauend habe ich einige Schlussfolgerungen gezogen, kann mir bitte jemand sagen, ob ich recht habe?
Meine Beobachtung
1 & gt; Wenn eine Seite über HTTP angefordert wird, wird zuerst das HTML-Skelett vom Browser empfangen. Zu diesem Zeitpunkt wird dem Benutzer nichts angezeigt.
2 & gt; Basierend auf dem, was im HTML-Skelett ist, werden einige zusätzliche Anforderungen für die Ressourcen (externes JavaScript, CSS, Bilder usw.) gesendet.
3 & gt; Der Browser wartet, bis er einen HTTP-Statuscode für das Skript und die css-Ressourcen erhält.
4 & gt; Sobald der HTTP-Statuscode für CSS und JavaScript empfangen wurde, startet der Browser das Laden des Dokuments von oben nach unten und führt das Embedded-JavaScript aus, auf das es unterwegs trifft.
5 & gt; Wenn das eingebettete JavaScript oben auf ein HTML-Element am unteren Rand verweist, wird das JavaScript fehlschlagen.
6 & gt; Sobald das gesamte Dokument geladen ist, wird das jquery-Ereignis $ (document) .ready ausgelöst. (Das ist, wenn ich JQuery verwende)
7 & gt; Der Browser wartet nicht auf Ressourcen außer Skripten und css, so dass Ressourcen wie Bilder später geladen werden können, nachdem die Seite dem Benutzer angezeigt wurde.
Sie haben es ziemlich richtig verstanden.
Aber es hängt vom Code ab (besonders Punkt 5, 6 und 7). Zum Beispiel, wenn der JS am oberen Rand innerhalb $(document).ready
ist, wird es nicht fehlschlagen.
Zweitens würde ich Firefox F12 oder Chrome F12 dem IE vorziehen. Sie sind sehr detailliert und entwicklerfreundlich. Sehen Sie sich die Registerkarte NET
an, um weitere Informationen zu erhalten. Es zeigt Ihnen die genaue Reihenfolge an, in der die Ressourcen aufgerufen und geladen werden, nach der Sie hauptsächlich gesucht haben.
Tags und Links html