将列表项替换为 jQuery 除了第一个，最后一个

Question

我有一个项目列表，其中第一个和最后一个用作导航按钮，因此当 ajax 加载新内容时，必须用检索到的新 HTML 替换中间项目。

<ul>
  <li class="photonav">Older Photos</li>
  <li class="photo">Item to replace</li>
  <li class="photo">Item to replace</li>
  <li class="photo">Item to replace</li>
  <li class="photonav">Newer Photos</li>
</ul>

带有 class photo 的物品必须替换为刚刚获得的 HTML 物品（预装 HTML 列表物品）。 photonav 项必须保持不变。

我知道我可以使用 .photo 选择器删除它们，但是如何在导航项之间放置新的 HTML 代码？

Answer 1

您只需选择并删除内部元素即可删除它们：

$('.photo').remove();

那时你有这个：

<ul>
  <li class="photonav">Older Photos</li>
  <li class="photonav">Newer Photos</li>
</ul>

那么你的下一步是在第一个 li 之后插入内容，对吗？然后在first()元素中插入内容after()：

$('.photonav').first().after(someContent);

Answer 2

您可以在列表中添加 <div>。

<ul>
  <li class="photonav">Older Photos</li>
  <div class="insert">
  <li class="photo">Item to replace</li>
  <li class="photo">Item to replace</li>
  <li class="photo">Item to replace</li>
  </div>
  <li class="photonav">Newer Photos</li>
</ul>

Answer 3

我觉得你可以

$('.photo').remove();
$('.photonav').last().before(newcontent)

将列表项替换为 jQuery 除了第一个，最后一个

Replace list items with jQuery except first, last

jquery

html-lists