如何基于JS计算的索引为Div元素添加指定样式类？

你已经完成了自定义索引的计算（bestFitDisplay），但当前代码中给元素加类的写法存在问题，以下是修正方案：

核心问题分析 #

你当前的代码行：

$(".item-container:eq(bestFitDisplay)").addClass("bestfit-active");

这里的bestFitDisplay是变量，但直接写在字符串选择器里会被当成字面量处理，无法正确识别索引值；另外，使用.item-container选择器可能和selectedElements数组的索引不匹配（因为slick筛选后DOM结构可能有变化）。

修正步骤 #

1. 先清除旧的类：每次计算新的最佳匹配元素前，移除所有元素的bestfit-active类，避免重复或残留样式。
2. 使用selectedElements数组直接获取目标元素：因为selectedElements和bestfitlist的索引是一一对应的，用数组索引直接访问元素更准确可靠。

修改后的代码片段 #

将原代码最后几行替换为：

console.log(bestfitlist)
const bestFitDisplay = bestfitlist.indexOf(Math.max(...bestfitlist))
console.log(bestFitDisplay)

// 先移除所有元素的bestfit-active类
$(".bestfit-active").removeClass("bestfit-active");

// 给对应索引的元素添加类
if (bestFitDisplay !== -1 && selectedElements[bestFitDisplay]) {
  $(selectedElements[bestFitDisplay]).addClass("bestfit-active");
}

额外注意点 #

• 增加判断bestFitDisplay !== -1是为了处理bestfitlist为空的边界情况（避免报错）。
• 直接操作selectedElements数组里的DOM元素，能确保和你计算的索引完全对应，不受slick插件DOM结构变化的影响。

内容的提问来源于stack exchange，提问作者Vanda Nagy