如何访问对象数组active_filters中的category属性？

Hey，针对你的需求，这里有几种简洁可靠的实现方式，帮你快速搞定遍历active_filters数组并执行目标DOM操作的逻辑：

1. 用数组forEach遍历（推荐，现代JS风格） #

这是最直观简洁的写法，适合支持ES6+的环境：

// 遍历每个活跃过滤器
active_filters.forEach(filter => {
  // 提取当前过滤器的category属性
  const category = filter.category;
  // 定位目标容器，遍历其中选中的input
  $("#" + category).find("input:checked").each(function() {
    // 在这里写你的操作逻辑，比如获取选中值、修改样式等
    console.log("选中项的值：", $(this).val());
    // 示例操作：给选中项添加高亮类
    // $(this).addClass('selected-highlight');
  });
});

2. 传统for循环（兼容旧浏览器） #

如果需要兼容不支持ES6语法的老项目，用传统for循环更稳妥：

for (let i = 0; i < active_filters.length; i++) {
  const currentFilter = active_filters[i];
  const category = currentFilter.category;
  $("#" + category).find("input:checked").each(function() {
    // 你的操作逻辑
  });
}

实用优化提示 #

• 避免无效操作：如果担心某些category对应的DOM容器不存在，可以先判断容器是否存在再执行操作，防止无意义的DOM查询：

  active_filters.forEach(filter => {
    const $targetContainer = $("#" + filter.category);
    if ($targetContainer.length) { // 确认容器存在
      $targetContainer.find("input:checked").each(function() {
        // 操作逻辑
      });
    }
  });
  

• 去重处理：如果active_filters数组里可能存在重复的category值，不想重复处理同一个容器，可以用Set做去重：

  const processedCategories = new Set();
  active_filters.forEach(filter => {
    const category = filter.category;
    if (!processedCategories.has(category)) {
      processedCategories.add(category);
      $("#" + category).find("input:checked").each(function() {
        // 操作逻辑
      });
    }
  });
  

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