Javascript 如何只加载页面的特定部分？

这段代码将在我的wordpress站点上的下一页帖子中显示。它针对页面的一个特定部分，div

，并且只将该部分拉入我的页面。它在前端看起来不错，但是，当我检查它在控制台上得到的响应时，它的响应是完整的页面，而不仅仅是“博客网格”。这会使页面速度变慢，并加载不必要的内容。如何修改此代码以请求或仅获得页面特定部分的响应（

）？我是ajax的初学者，在过去的几个小时里，我一直在为这个问题绞尽脑汁

jQuery(function(){
    var page = 2;
    var loadmore = 'on';
    jQuery(document).on('scroll resize', function() {
      if (jQuery(window).scrollTop() + jQuery(window).height() + 700 > jQuery(document).height()) {
        if (loadmore === 'on') {
          loadmore = 'off';
          jQuery('#spinner').css('visibility', 'visible');
          jQuery('#lazyload').append(jQuery('<div class="blog-grid" id="p' + page + '">').load(global.getPermalink + "page/" + page + ' #grid-item', function() {
            page++;
            loadmore = 'on';
            jQuery('#spinner').css('visibility', 'hidden');
          }));
        }
      }
    });
    jQuery( document ).ajaxComplete(function( event, xhr, options ) {
        if ( $(".blog-grid").is(':empty'))
        {
           loadmore = 'off';
           $(".all-posts-message").fadeIn(600);
           setTimeout(function(){
               $(".all-posts-message").fadeOut(600);
               }, 5000);
        }
      if (xhr.responseText.indexOf('class="blog-grid"') === -1) {
      }

      //blog grid
    var small_blocks2 = $('.blog-grid > div:nth-child(5n+3), .blog-grid > div:nth-child(5n+4), .blog-grid > div:nth-child(5n+5)').not(".block-1, .block-2"); 
    $(small_blocks2).addClass("col-xs-4 block-sm");

    });
}); //blog grid add classes after new content is inserted
    var block_1 = $(".grid-item").eq(0)
        $(block_1).addClass("col-xs-8 block-lg block-1");

jQuery（函数（）{
var-page=2；
var loadmore='on'；
jQuery（document）.on（'scroll resize'，function（））{
if（jQuery（window）.scrollTop（）+jQuery（window）.height（）+700>jQuery（document）.height（））{
如果（loadmore==='on'）{
loadmore='off'；
jQuery（'#spinner'）.css（'visibility'，'visible'）；
jQuery（'#lazyload'）.append（jQuery（''）.load（global.getPermalink+“page/”+page+“#grid item'，function（））{
page++；
loadmore='on'；
jQuery（'#spinner'）.css（'visibility'，'hidden'）；
}));
}
}
});
jQuery（文档）.ajaxComplete（函数（事件、xhr、选项）{
如果（$（“.blog grid”）.is（':empty'））
{
loadmore='off'；
$（“.all posts message”）.fadeIn（600）；
setTimeout（函数（）{
$（“.all posts message”）.fadeOut（600）；
}, 5000);
}
if（xhr.responseText.indexOf（'class=“blog grid”）=-1）{
}
//博客网格
var small_blocks2=$（'.blog grid>div:nth child（5n+3），.blog grid>div:nth child（5n+4），.blog grid>div:nth child（5n+5））。不是（“.block-1，.block-2”）；
$（小区块2）.addClass（“col-xs-4区块sm”）；
});
}); //博客网格在插入新内容后添加类
变量块_1=$（“.grid item”）.eq（0）
$（block_1）.addClass（“col-xs-8 block lg block-1”）；

---

谢谢。

没有任何方法可以做到这一点。Ajax只会在您提供的任何url上请求完整的资源。简单地说，jQuery.load（）只能检索您可以手动浏览的相同资源

因此，除非您在服务器端编写一个只提供您想要的特定div的页面代码（例如，通过使用查询字符串），否则您将始终检索整个页面，然后在客户端筛选结果