javascriptjqueryonloaddomready

What are means of domready, onload, body, head?


I have doubts on the domready, onload, body, head. when i am linking some js into head, it's not working. otherwise, its working in the body.

And i have noticed in the JSFIDDLE, it mentiond.

What are means fo this and differnce?

Could you please explain about it?


Solution

  • <head> contains all the information regarding the Page properties, CSS and JavaScript. Though CSS and JavaScript can be included in the body as well. Head will include Page's meta information, Title, base URL etc.

    <body> contains the actual content of the body. Which users visiting the website actually see or interact with.

    DOM is Document Object Model. It's the basic structure or you can say the skeleton of the Page on which the page stands.

    domready is an event which is fired as soon as the DOM has finished loading. For eg: Suppose a page has only one image. It will wait for the image tag to be parsed. As soon as the image tag is received it will be fired. It will NOT wait for whole image to be loaded from the source.

    onload is an event which is fired when complete(DOM + content) page is loaded. In the previous example in donready, onload will wait for the image to be fetched from the source and then will be fired.