Understanding a mobile page structure

The most important concept of jQM is to understand the structure of a mobile page, which is not the same as a normal HTML page. A mobile page is constructed inside an HTML <div> box with a jQM specific attribute, data-role='page', marked as a boundary. In fact, the data-* syntax is Customer Data Attributes defined in HTML5 standard. This allows web developers to store custom data specific to the page or application, which can easily access the data attribute values. For more information on APIs for HTML visit http://dev.w3.org/html5/spec/single-page.html#custom-data-attribute. Within a mobile page, normal HTML tags, such as input, hyperlinks, select, and so on are used.

An HTML document can contain multiple mobile pages and links through anchor and the id attribute. An anchor is the same as a normal HTML anchor (for example, #chart). The framework resolves the anchor reference and retrieves a mobile page with matching id attribute, which has the...