Document Ready Equivalent Without jQuery

Wikitechy | 307 Views | jquery | 02 Jun 2016

 

  • In jQuery the onload attribute fires when an object has been loaded.
  • onload is the most oftenly used within the <body> element to execute a script once a web page has completely loaded all content (including images, script files, CSS files, etc.). 
  • The onload attribute can be used to check the visitor's browser type and browser version, and also about the load proper version of the web page based on the information.

What is document ready in jQuery?

  • The ready event occurs when the DOM (document object model) has been loaded.
  • Because this event occurs after the document is ready.
  • It is a good place to have all the other jQuery events and functions. 

Sample Code: 

<!DOCTYPE html> 
<html>
<head>
    <title>

        Wikitechy - body on load event
    </title>
    <script>

    function myfunction()
    {
        alert("venkat from WikiTechy");
    }
    </script>
</head>
<body
onload="myfunction()">
    <button
id="button1" >
        button1
    </button> 
</body>
</html>

Code Explanation:

 

    Here in this body section we assign the onload function & the function name as “myfunction()” ,in which inside the body section we have created the button ”button1” using button element.

    Here we define the function “myfunction” , where the action has been performed when the page is loaded in the browser in which  the alert box displays the message “venkat from wikiTechy”.

Sample Output:


    Here in this output the HTML document is loaded in the browser window as shown here.

    So, the alert box will be show the message “venkat from wikitechy”.