Method 1: Using the on() method with the load event: The on() method in jQuery is used to attach an event handler for any event to the selected elements. The window object is first selected using a selector and the on() method is used on this element.
The ‘load’ event fires whenever the whole page has finished loading including other resources like the stylesheets and images. This event is checked for bypassing it to the on() method. The function to be executed can be then invoked in the second parameter of this method. This will now invoke the function after the page has completed loading.
$(window).on('load', functionTobeLoaded() )
Output: After the page loaded:
Method 2: Using the ready() method: The ready() method in jQuery is used to execute code whenever the DOM becomes safe to be manipulated. It accepts a handler that can be passed with the function required to be executed. It will now invoke the function after the page has completed loading.
$(document).ready( functionTobeLoaded() )
Output: After the page loaded
- How to show Page Loading div until the page has finished loading?
- JQuery | Set focus on a form input text field on page load
- How to create fade-in effect on page load using CSS ?
- How to execute AngularJS controller function on page load ?
- What Happens To CSS When We Load a Page?
- How to reload page after specific seconds in jQuery ?
- How to display search result of another page on same page using ajax in JSP?
- How to redirect a page to another page in HTML ?
- How to pass form variables from one page to other page in PHP ?
- jQuery | load() with Examples
- How to minify HTML code of PHP page ?
- Ways To Reduce The Loading Time Of Website | Set 1
- Ways To Reduce The Loading Time Of Your Website | Set 2
- What is Lazy Loading?
- Loading Excel spreadsheet as pandas DataFrame
- Loading Text Animation Effect using CSS
- How to Create Skeleton Screen Loading Effect using CSS ?
- How to Create Loading Blur Text Animation Effect using HTML and CSS ?
- How to Create Animation Loading Bar using CSS ?
- How to Create a Dot loading Animation using HTML and CSS?