Question

我正在使用类.def-set的元素数量可变的页面上工作。在某些页面上，它可能有60个，而在其他页面上，它可能只有1个。

我已经能够在.editorial-content-feed-replacement类的第3个实例之后附加一个元素.def-set，这是我们想要的，但我现在想知道是否有办法如果页面上的内容少于3，则在.def-set的第一个或第二个实例后附加它。

我目前的代码：$('.def-set:eq(2)').append('.editorial-content-feed-replacement')

Answer 1

您可以使用

计算.def-set元素的数量

let num = $(".def-set").length

然后与if-else逻辑进行比较以完成您想要的任务：

if (num >= 3) {
  $('.def-set:eq(2)').append('.editorial-content-feed-replacement');
} else {
  // This will append it after the last .def-set element
  $('.def-set').append('.editorial-content-feed-replacement');
}

Answer 2

您可以使用长度获取.defSet中的元素数量 - 然后根据结果将索引设置为1或2;

请注意下面的三元运算符 - 这是一种速记方式 - if（length＆lt; 3）{index = 1} else {index = 2};

var defSetLength = $('.def-set').length;
var index;
defSetLength < 3 ? index = 1 : index = 2;
$('.def-set:eq(index)').append('.editorial-content-feed-replacement');

Answer 3

您可以使用slice()和last()。

使用两个不同长度的列表的示例：

＆＃13;

$('#list-one li').slice(0,3).last().append(' - Appended content');
$('#list-two li').slice(0,3).last().append(' - Appended content');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<strong>List one</strong>
<ul id="list-one">
  <li>Item 1</li>
  <li>Item 2</li>
</ul>
<strong>List two</strong>
<ul id="list-two">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
</ul>

＆＃13;

将元素追加到：eq（2）如果页面上有3个或更多，或者：eq（1）如果小于3

3 个答案: