User Tools

Site Tools

Trace:

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
programmieren:javascript:script_wenn_seite_geladen_ausfuehren [2020/10/06 09:38] – jgehrkeprogrammieren:javascript:script_wenn_seite_geladen_ausfuehren [2022/12/17 12:28] (current) – external edit 127.0.0.1
Line 6: Line 6:
  
 **Diese Funktion ruft eine Funktion(Callback) auf, wenn bereits das HTML geladen ist** **Diese Funktion ruft eine Funktion(Callback) auf, wenn bereits das HTML geladen ist**
 +
 +Das Script wird ausgeführt, wenn das HTML geparsed wurde. Es kann aber sein, dass noch nicht alle Medien, Bilder oder Stylesheets geladen wurden.
  
 <code javascript> <code javascript>
- /* Wenn HTML Geladen & Geparsed ist */ +/* Wenn HTML Geladen & Geparsed ist */ 
- function on_ready( callback ) { +function on_ready( callback ) { 
- // Falls die Seite bereits geladen ist + // Falls die Seite bereits geladen ist 
- if ( document.readyState!='loading' ) callback(); + if ( document.readyState!='loading' ) callback(); 
- // Falls die Seite noch lädt + // Falls die Seite noch lädt 
- else document.addEventListener( 'DOMContentLoaded', callback ); + else document.addEventListener( 'DOMContentLoaded', callback ); 
- }+}
 </code> </code>
  
 **Diese Funktion ruft eine Funktion(Callback) auf, wenn alle Assets geladen wurden** **Diese Funktion ruft eine Funktion(Callback) auf, wenn alle Assets geladen wurden**
 +
 +Das heißt, dass Javascript wird erst ausgeführt, wenn alle CSS Stylesheets und Bilder geladen wurden.
  
 <code javascript> <code javascript>
- /* Wenn alles geladen (Css, Bilder) ist */ +/* Wenn alles geladen (Css, Bilder) ist */ 
- function on_load( callback ) { +function on_load( callback ) { 
- // Falls die Seite bereits geladen ist + // Falls die Seite bereits geladen ist 
- if ( document.readyState=='complete' ) callback(); + if ( document.readyState=='complete' ) callback(); 
- // Falls die Seite noch lädt + // Falls die Seite noch lädt 
- else document.addEventListener( 'load', callback ); + else window.addEventListener( 'load', callback ); 
- }+}
 </code> </code>
  
Line 34: Line 38:
  
 <code javascript> <code javascript>
- /* Beispiel 1 */ +/* Beispiel 1 */ 
- on_ready( function(){ +on_ready( function(){ 
- console.log( "HTML ist geladen" ); + console.log( "HTML ist geladen" ); 
- })+})
  
- /* Beispiel 2 */ +/* Beispiel 2 */ 
- on_load( complete_page_loaded );+on_load( complete_page_loaded );
  
- function complete_page_loaded(){ +function complete_page_loaded(){ 
- console.log( "Alle Assets wurden geladen." ); + console.log( "Alle Assets wurden geladen." ); 
- }+}
 </code> </code>
programmieren/javascript/script_wenn_seite_geladen_ausfuehren.1601977117.txt.gz · Last modified: 2022/12/17 12:28 (external edit)
CC Attribution-Share Alike 4.0 International Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International

Page Tools