jquery - jQuery .loadを置換する代わりに追加できますか？

Question

WordPressをインストールしていて、jQueryを使用してLoadMoreエフェクトを作成しようとしています。ページフラグメントに基本的な.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>

2ページ目：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');

悲しいことに、2つの問題があります。まず、.load関数が#articles div2番目のページからとその内容を取得し、既存のに配置し#articles divます。つまり、これが機能したとしても、クリックするたびにdiv内に再帰的なdivが存在することになります。散らかっています。

誰か.story classesが2番目のページから#articles div最初のページのに単に追加するコマンドを手伝ってもらえますか？後で、変数、ループ、およびWordPress用のPHPを使用して自動化するロジスティクスを理解できます。適切なjQueryスクリプトを使用して支援が必要です。

PSボーナスの質問：jQuery .load / .getがページビューに悪影響を与えるかどうかを誰かが知っている場合、これは広告ベースの収益を持つ人にとって重要です。私に知らせてください！各.load/.getがGoogleAnalyticsの別のヒットとしてカウントされる場合、私たちは問題ありません。

ありがとう！

Answer 1

このメソッドを使用してコンテンツを追加することはできませんjQuery.load()が、次を使用して必要なことを行うことができますjQuery.get()。

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

Answer 2

私はおそらくこのようにするでしょう。

$('#articles').append($('<div/>', { id: '#articles-page2' });
$('#articles-page2').load('http://example.com/page/2/ #articles > *');

#articles > *すべての直接の子をにフェッチし#articleます。

Answer 3

データを追加するために、$。load（）を使用したくないと思います。代わりに、$。ajax（）の使用を検討することをお勧めします。

$.ajax({
  url: 'yourlocation/test.html',
  success: function(data) {
    $('.result').html(data);
    $("#yourdiv").append(data);
  }
});

Answer 4

これを試してみてください。

$('#articles').append( $('<div/>').load('http://example.com/page/2/ #articles') );

Answer 5

$.get(YourURL, function(data){ 
$('#divID').append(data);});