jQuery Mobile：对所有页面使用相同的页眉页脚

我正在尝试实现一些代码，这些代码将在我的所有网页上创建页眉和页脚，而不是对它们进行硬编码。我试过这个：

我在我的“主页”中有这个，我只是将我想要的标题包装在 div 中。

<div id="headerProto">
   <div data-role="header" data-position="fixed" data-theme="b">
       <h1> Title </h1>          
   </div> 
</div>

然后在其他页面中我有：

<div class="headerChild">
</div>

我补充道：

$(".headerChild").html($("#headerProto").html());

没有骰子。不管怎样，这完全是我对应该如何做的猜测。有没有更好的办法？

Using .load() http://api.jquery.com/load/可能会有所帮助，然后只需将要包含的代码放入要链接的文件中即可。

$('.headerChild').load('pathto/headerProto.html')

如果您不想将数据保存在单独的文件中，则可以使用另一种方法： 我还没有这样做，但通过一些快速研究，您还可以链接到文件中的元素。

$('.headerChild').load('pathto/mainPage.html #headerProto')