У меня установлена ​​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');

К сожалению, есть 2 вопроса. Сначала функция .load захватывает#articles div и его содержимое со второй страницы и помещает его в существующий#articles div, Это означает, что даже если бы это работало, внутри каждого из них были бы рекурсивные div-ы, возникающие в результате каждого клика. Это просто грязно.

Может ли кто-нибудь помочь мне с командой просто добавить.story classes со второй страницы в#articles div на первой странице? Я могу понять логистику автоматизации с помощью переменных, циклов и PHP для WordPress после. Просто нужна помощь с правильным скриптом jQuery.

Постскриптум Дополнительный вопрос: Если кто-нибудь знает, повредит ли jQuery .load / .get просмотрам страниц, что важно для тех, кто имеет доход от рекламы, пожалуйста, дайте мне знать! Если каждый .load / .get считается еще одним хитом для Google Analytics, у нас все хорошо!

Спасибо!