内容:

我有一个清单。使用jQuery,我可以动态地...

...隐藏/显示某些列表项。

...计算第三和第四列表项以应用特定的类。

问题:

使用第n个子选择器的CSS样式(来自样式表)将应用于每个第三个列表项。问题是当我动态隐藏/显示列表项时,CSS nth-child选择器似乎没有重新计算。

由于jQuery已经在计算第三个列表项,因此我不需要重新计算CSS的第n个子选择器,除非没有办法取消它或将其销毁。

代码:

标记:

  • Content
  • Content
  • Content
  • Content
  • Content
  • Content
  • Content
  • Content
  • Content
  • Content

jQuery:

$('.teamlist li:visible').each(function (i) {

if (i % 3 == 0) $(this).addClass('teamlist_fourth_item');

});

$('.teamlist li:visible').each(function (i) {

if ((i+1) % 3 == 0) $(this).addClass('teamlist_third_item');

});

不需要的CSS:

.teamlist li:nth-child(3n+3) {

margin-right: 0;

}

问题:

如何销毁或强制重新计算CSS nth-child选择器?

Logo

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。

更多推荐