本节书摘来自异步社区《jQuery、jQuery UI及jQuery Mobile技巧与示例》一书中的第9章，第9.19节，作者：【荷】Adriaan de Jonge , 【美】Phil Dutson著，更多章节内容可以访问云栖社区“异步社区”公众号查看

9.19　技巧：利用JavaScript调用加载页面

当变更至不同的页面时，在移动端的浏览器切换到新页面之前，首先会把页面加载到DOM里面。在链接上使用data-prefetch属性会使jQuery Mobile在用户点击链接前预加载页面。

在HTML中甚至不用链接也能完成类似的功能。代码清单9-23演示了如何使用JavaScript代码来提前获取数据。

代码清单9-23　通过JavaScript代码来加载页面

00  01  02  03　　 04　　
     06　　
    08　　11　　14　　27  28  29 30 
    
     31 32　 
     
      33　　 
      
Load page
34　 
     
35 36　 
     
      　37　　 
      Change Page38　 
     
39 40 41 
    

为了能看到这种加载动作的结果，需要一种工具才行，比如Firefox中的Firebug或者别的浏览器中类似的开发者工具。点击按钮后，会触发这段代码，然后一张新的页面会出现在DOM树中。

第20～22行演示了loadPage函数是如何同promise1一起工作的。loadPage()方法设置了要加载的页面，然后使用transition选项设置页面视图以“淡入”的特效显现。