Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the very first event fired by an HTML document?

I'm curious which event is fired first when using jQuery and jQuery Mobile.

Oddly enough, the first console output I get is pagebeforecreate then document ready and then onload.

I would like to know if any other events are being fired before these ones.

http://jsfiddle.net/yYGYe/2/

$('html').bind('pagebeforecreate',function(event) {
    console.log("pagebeforecreate");
});

$(document).ready(function() {
    console.log("document ready");
});

window.onload = function(){
    console.log("onload");
};
like image 926
Jolix Avatar asked Mar 31 '13 22:03

Jolix


People also ask

What is the first event that gets fired when you load an application in a browser?

The load event is fired when the whole page has loaded, including all dependent resources such as stylesheets and images. This is in contrast to DOMContentLoaded , which is fired as soon as the page DOM has been loaded, without waiting for resources to finish loading.

What is HTML DOM event?

HTML DOM events allow JavaScript to register different event handlers on elements in an HTML document. Events are normally used in combination with functions, and the function will not be executed before the event occurs (such as when a user clicks a button).

How do you check an event is firing?

Open Google Chrome and press F12 to open Dev Tools. Go to Event Listener Breakpoints, on the right: Click on the events and interact with the target element. If the event will fire, then you will get a breakpoint in the debugger.

Which event is triggered when Web page opens in browser?

If you're looking to invoke an event handler before onload , DOMContentLoaded is one event that usually fires before.


1 Answers

What you're looking for is a comprehensive visualisation of the jQuery mobile event model lifecycle, this diagram below is available in Pro jQuery Mobile and on the author's blog:

jQuery Mobile Events Diagram - Brad Broulik

Please remember that this is jQuery mobile specific. The list of native events is available as part of the W3 spec, and the only one relevant to the document lifecycle is good old load.

like image 58
Oleg Avatar answered Oct 06 '22 08:10

Oleg