如何使用JQuery获取对象数组中每个MealType数组的值？

假设你的对象数组变量名为mealData，结构如下：

const mealData = [
  {MealType: [/* 4个元素 */]},
  {MealType: [/* 8个元素 */]},
  {MealType: [/* 8个元素 */]},
  {MealType: [/* 4个元素 */]},
  {MealType: [/* 4个元素 */]},
  {MealType: [/* 4个元素 */]},
  {MealType: [/* 4个元素 */]}
];

方法一：逐个处理每个MealType的值 #

使用jQuery的$.each()嵌套遍历外层数组和内层MealType数组，按需处理每个值：

$.each(mealData, function(groupIndex, groupItem) {
  $.each(groupItem.MealType, function(typeIndex, mealValue) {
    // 示例：打印每个值的位置和内容
    console.log(`第${groupIndex}组，第${typeIndex}个MealType值：`, mealValue);
    
    // 示例：将值插入页面元素
    // $('#meal-list').append(`<li>${mealValue}</li>`);
  });
});

方法二：收集所有MealType值到一个数组 #

如果需要把所有MealType的元素汇总到一个新数组中：

const allMealValues = [];
$.each(mealData, function(_, groupItem) {
  // 合并当前组的MealType元素到总数组
  allMealValues.push(...groupItem.MealType);
});

// 查看汇总结果
console.log('所有MealType值集合：', allMealValues);

注意事项 #

如果你的数组是从DOM元素的data-*属性获取的，需要先解析为JavaScript数组：

// 假设DOM元素id为meal-data，存储了JSON格式的数组
const mealData = JSON.parse($('#meal-data').data('meal'));
// 再执行上述遍历逻辑

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