Jquery / js - 刷新页面后加载页眉和页脚

Question

我有一个index.html页面，其中包含页眉和页脚。通过使用以下功能动态更改其内容。为了轻松分享网址，我已加入/实施history.pushState。

请查看以下脚本：

<script>
    function getfile(data) {
        var file= '/file/'+data+'.html';
        $('#content').load(file);
        history.pushState(null, null, file);
    }
</script>

这个菜单也在index.html

中

<a href="#" onclick="getfile('home')">Home</a>
<a href="#" onclick="getfile('test')">Test</a>
<a href="#" onclick="getfile('aboutme')">About Me</a>

<div id="content"></div>

我遇到的问题是刷新后无法看到此index.html中的页眉和页脚;因此，我的问题是，我怎样才能解决这个问题，以便在刷新后页眉和页脚重新出现？