Everybody starting with jQuery Mobile should carefully study the part of
the documentation about Ajax page loading.
Read this section carefully! It is the very first one in the demo
section of the documentation. (Yes, I am afraid that some very
important parts of the documentation are in the "demo"...)
jQuery Mobile "hijacks" links,
so that you can write normal links, and jQuery Mobile stealthily
makes Ajax requests instead of loading a new document. It then
inserts the content it gets from the Ajax request into the
document, and makes a page transition. It then (in most cases)
discards the exiting page from the document. (Once the transition
is complete.)
Implementing this
yourself would require writing a lot of code. jQuery does it for
you, "by magic" just by writing normal links.
Jake and I like to debate the fact
(yes, I say FACT! ;) ) that what most people call
"pages" in HTML are "documents", and no
standards document calls them "pages".
But because almost everybody calls documents
"pages", this is one of the biggest newbie confusions
about jQuery Mobile. You can't treat them exactly like
documents!
Somehow, the
developers of jQuery Mobile 11.0 thought that everybody would
understand that a page is not a document. They were optimists.
The developers somehow thought
everybody would read the very first paragraph. Almost nobody
does, or it goes in one (figurative) ear and out the
other.
The page is
the primary unit of interaction in jQuery Mobile and
is used to group content into logical views that can
be animated in and out of view with page transitions.
A HTML document may start with a single
"page" and the Ajax navigation system will
load additional pages on demand into the DOM as users
navigate around. Alternatively, a HTML document can be
built with multiple "pages" inside it and the
framework will transition between these local views with no
need to request content from the server.
