jQuery .load可以追加而不是替换吗？

Question

我有一个WordPress安装,我正在尝试使用jQuery创建一个Load More效果.我在使用页面片段的基本.load功能时遇到了一些麻烦.我不介意使用.get,因为我在这里看到一些线程,认为这是一个更好的解决方案.

这是我的页面URL结构和内容:

第一页: http://example.com/page/1/

HTML:

<div id="articles">
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
</div>

第二页: http://example.com/page/2/

HTML:

<div id="articles">
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
  <div class="story">blah blah blah</div>
</div>

我在页面底部有一个链接,我尝试过以下操作:

jQuery(#articles).load('http://example.com/page/2/ #articles');

可悲的是,有两个问题.首先,.load函数#articles div从第二页抓取它的内容并将其放入现有的内容中#articles div.这意味着,即使这是有效的,每次点击都会产生div内的递归div.这太乱了.

是否有人可以帮助我将命令.story classes从第二页添加到#articles div第一页上？我可以用WordPress之后的变量,循环和PHP来计算自动化的后勤.只需要适当的jQuery脚本一些帮助.

PS Bonus问题:如果有人知道jQuery .load/.get是否会损害浏览量,这对于那些有广告收入的人来说非常重要,请告诉我们!如果每个.load/.get都算作Google Analytics的另一个点击,我们就会很好!

谢谢!

Answer 1

您无法使用该jQuery.load()方法附加内容,但您可以使用以下内容执行操作jQuery.get():

$.get('/page/2/', function(data){ 
  $(data).find("#articles .story").appendTo("#articles");
});