android - The relationship between Phonegap's "onBodyLoad()/onDeviceReady()" functions and Jquery's "$(document).ready()" -

i using phonegap + jquery mobile in android, confused phonegap's "onbodyload()/ondeviceready()" functions , jquery's "$(document).ready()".

in phonegap documents:

phonegap consists of 2 code bases: native , javascript. while native code loading, custom loading image displayed. however, javascript loaded once dom loads. means web application could, potentially, call phonegap javascript function before loaded.

the phonegap deviceready event fires once phonegap has loaded. after device has fired, can safely make calls phonegap function.

typically, want attach event listener document.addeventlistener once html document's dom has loaded.

in jquery doc:

while javascript provides load event executing code when page rendered, event not triggered until assets such images have been received. in cases, script can run dom hierarchy has been constructed. handler passed .ready() guaranteed executed after dom ready, best place attach other event handlers , run other jquery code. when using scripts rely on value of css style properties, it's important reference external stylesheets or embed style elements before referencing scripts.

in cases code relies on loaded assets (for example, if dimensions of image required), code should placed in handler load event instead.

my experiments shows ready() earlier ondeviceready(), how explain this? how should use them? should put ready() in ondeviceready() make every call safe?

thank in advance.

regards, chris

$(document).ready fire first because triggered when dom elements have loaded. images, javascript functions, css, etc. may not have loaded time.

so phonegap has put onload method on body's onload method fires when particular part of dom ready. once dom prepared, create event listener ensure phonegap.js itself ready (and not application ui, example). after phonegap.js loaded can use functions provides.

so yes, $(document).ready fire first, not mean can use phonegap.js (the 'api' calls). cannot put $(document).ready inside of function (as far know), since triggered dom being loaded. can (but should not) call ondeviceready function $(document).ready. problem if device not in fact ready, api calls not made.

so continue use body onload/ondeviceready chain have set up. let me know if needs more elaboration.