jQuery Mobile data-* 属性
jQuery Mobile 使用 HTML5 data-* 属性为移动设备创建“对触摸友好的”美观的外观。
一、设置一个按钮
<a href="#popupCloseLeft" data-rel="popup" data-role="button">左侧叉关闭</a>
data-rel="popup" data-role="button" 配合使用，表示当前标签外观是一个button，并且点击后会关联一个popup
二、设置对话框上的关闭按钮
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
data-rel="back" 设置点击效果就是后退一步(即关闭)，data-icon="delete" 设置按钮上的图标， data-iconpos="notext" 设置按钮不显示任何文字，如果
这个地方设置为top,left,right,bottom四个之一的话，那么按钮就会带有文字，这个文字就是 <a>写在这里的文字</a>
class="ui-btn-right" 类别设置了这个按钮显示的位置
二、对话框标题设置：
<div data-role="header" data-theme="a" class="ui-corner-top">
指定类型header，指定类型ui-corner-top
三、对话框弹出位置
<a href="#popupImg1" data-rel="popup" data-position-to="window">
所有链接，包括 data-role="button" 的链接以及表单提交按钮。
| Data 属性 | 值 | 描述 |
|---|---|---|
| data-ajax | true | false | 规定是否通过 AJAX 来加载页面，以改进用户体验和过渡。如果设置为 false，则 jQuery Mobile 将进行普通的页面请求。 |
| data-direction | reverse | 反转过渡动画（仅用于页面或对话） |
| data-dom-cache | true | false | 规定是否清除个别页面的 jQuery DOM 缓存（如果设置为 true，则您需要注意对 DOM 的管理，并全面测试所有移动设备）。 |
| data-prefetch | true | false | 规定是否把页面预取到 DOM 中，以使其在用户访问时可用。 |
| data-rel | back | dialog | external | popup | 规定有关链接如何行为的选项。 Back - 在历史记录中向后移动一步。 Dialog - 将页面作为对话来打开，不在历史中记录。 External - 链接到另一域。 opens - 打开弹出窗口。 |
| data-transition | fade | flip | flow | pop | slide | slidedown | slidefade | slideup | turn | none | 规定如何从一页过渡到下一页。参加 jQuery Mobile 过渡。 |
| data-position-to | origin | jQuery selector | window | 规定弹出框的位置。 Origin - 默认。在打开它的链接上弹出。 jQuery selector - 在指定元素上弹出。 Window - 在窗口屏幕中间弹出。 |
alt="Sydney,Australia"在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息
四、返回上一步按钮的实现：
<a data-rel="back" href="http://www.baidu.com">返回</a>data-rel="back" 表明任何的单击操作都被视为回退动作，href的设置都是无效的，但是为了使其可以点击并且有效果，必须要设置一个占位值