jQuery Mobile - 页面
用户可以与 jQuery Mobile 页面交互,它将内容分组为逻辑视图和页面视图。 页面视图可以使用页面转换动画。 可以使用 HTML 文档创建多个页面,因此无需向服务器请求内容。
下表详细说明了页面的类型。
序号 | 类型 & 说明 |
---|---|
1 | Single Page
使用编写模板的标准方法在 HTML 文档中创建单个页面。 |
2 | Multi-Page Template
多个页面可以包含在单个 HTML 文档中,通过使用 data-role = "page" 添加多个 div 来一起加载。 |
3 | Dialogs Page
模态对话框在页面上方的交互式叠加层中打开内容。 |
约定,而非要求
页眉、页脚、页面和内容等数据角色属性元素用于提供页面的基本格式和结构。
对于单页文档,自动初始化所需的页面包装器设置为可选。
对于具有自定义布局的网页,可以排除结构元素。
为了管理页面,页面包装器在未包含在标记中时由框架注入。
预取页面
包括属性data-prefetch,我们可以在单页模板中将页面预取到DOM中。 如需更多信息,请单击此处。
DOM 缓存
当浏览器内存在 DOM 中变满时,它会降低移动浏览器的速度,或者可能由于加载多个页面而崩溃。 有一种简单的方法可以保持 DOM 整洁 −
当通过 ajax 加载页面时,它指示在重定向到另一个页面时从 DOM 中删除该页面。
您访问过的上一个页面可以在您再次访问时从缓存中检索。
您可以使用以下行告诉 jQuery Mobile 将其保留在 DOM 中,而不是删除页面 −
$.mobile.page.prototype.options.domCache = true;
在页面插件上将 domCache 选项设置为 true 以将所有页面保留在之前访问过的 DOM 中。
pageContainerElement.page({ domCache: true });