jQuery Mobile – The Data Attributes

The jQuery Mobile framework uses HTML5 data- attributes to apply a touch-friendly aesthetic to the user interface on mobile devices.

The basic structure of an app using the jQuery Mobile framework  can be as follows:

<div data-role="page" id="page1">

   <div data-role="header">
   </div> <!-- header -->

   <div data-role="main" class="ui-content">
   </div> <!-- main -->

   <div data-role="footer" id="footer">
   </div> <!-- footer -->

</div> <!-- page -->