29 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			29 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| ---
 | |
| title: Onload Event
 | |
| ---
 | |
| ## Onload Event
 | |
| The `onload` event is used to execute a JavaScript function immediately after a page has been loaded.
 | |
| 
 | |
| ### Example:
 | |
| ```javascript
 | |
| <body onload="myFunction()">
 | |
| 
 | |
| <script>
 | |
|   function myFunction() {
 | |
|     alert('Page finished loading');
 | |
|   }
 | |
| </script>
 | |
| ```
 | |
| 
 | |
| In the above example, as soon as the web page has loaded, the `myFunction` function will be called, showing the `Page finished loading` alert to the user.
 | |
| 
 | |
| the `onload` event is most often used within the `<body>` element to execute the script. If it is attached to the `<body>`, the script will run once the web page has completely loaded all content (images, script files, CSS files, etc.).
 | |
| 
 | |
| #### More Information:
 | |
| 
 | |
| <a href='https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload' target='_blank' rel='nofollow'>MDN</a>
 | |
| 
 | |
| #### Other Resources
 | |
| <a href='https://api.jquery.com/on/' target='_blank' rel='nofollow'>jQuery .on() Event Handler Attachment</a>
 | |
| <a href='https://stackoverflow.com/questions/588040/window-onload-vs-document-onload' target='_blank' rel='nofollow'>Stack Overflow: window.onload vs. document.onload</a>
 |