把pjax应用到此博客

pjax可以使网站局部加载,避免重复内容重新加载,减少网站加载量,也提高重复内容的连贯性。例如听歌不会切断,看板娘不会重载。

      <div id="pjax-container">
      </div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>
<script>
$(document).pjax('a', '#pjax-container',{fragment: '#pjax-container',timeout:"10000"})
</script>

'a'意思是作用在全站的a标签跳转链接

第一个'#pjax-container'是原网页要替换内容的标签的id,第二个fragment的属性'#pjax-container'是目标网页的目标内容所在标签的id。一般应用时这两个id都写成一样,因为这样才能从目标网页跳转到原网页

timeout是如果到这个时间还没加载完成,则全局刷新,要设置大一点,避免全局刷新。

<script>
$(document).on('pjax:send',
function() {
    $('#loader-wrapper').addClass("in");
})

$(document).on('pjax:complete',
function() {
    $('#loader-wrapper').removeClass("in");
})
</script>
隐藏