如何在jQuery中每个三个Li后插入一个新li

Question

我想使用jquery在每个第三个li标记后插入一个li标记。考虑以下示例，我有九个li项

 <ul>
    <li>1 element</li>
    <li>2 element</li>
    <li>3 element</li>
    <li>4 element</li>
    <li>5 element</li>
    <li>6 element</li>
    <li>7 element</li>
    <li>8 element</li>
    <li>9 element</li>
</ul>

<ul>
  <li>1 element</li>
  <li>2 element</li>
  <li>3 element</li>
  <li class="sss">item inserted</li>
  <li>4 element</li>
  <li>5 element</li>
  <li>6 element</li>
  <li class="sss">item inserted</li>
  <li>7 element</li>
  <li>8 element</li>
  <li>9 element</li>
  <li class="sss">item inserted</li>
</ul>

Answer 1

您可以:nth-child用来定位每个3,6,9 ... n元素。并在匹配的元素后插入新内容：

$('<li class="sss">item inserted</li>').insertAfter($('li:nth-child(3n+3)'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<ul>
    <li>1 element</li>
    <li>2 element</li>
    <li>3 element</li>
    <li>4 element</li>
    <li>5 element</li>
    <li>6 element</li>
    <li>7 element</li>
    <li>8 element</li>
    <li>9 element</li>
</ul>