如何修改jQuery选择器each函数的遍历逻辑来返回目标数组

问题原因 #

你使用的each()方法仅用于遍历jQuery对象，不会收集回调函数的返回值生成数组，因此你无法通过链式调用join()得到预期结果。

解决方案 #

将each()替换为jQuery提供的map()方法，该方法会遍历元素并把回调的返回值收集为类数组对象，最后调用get()将类数组转为标准JS数组即可。

修改后的代码如下：

// 第一步：生成符合要求的数组
const targetArr = $("table tr").map(function () {
  const $tdList = $(this).find("td");
  // 过滤无td的表头行、以及td数量不足9行的异常数据，可按需删除该判断
  if ($tdList.length < 9) return;
  // trim用于去除单元格首尾多余空白字符，可按需删除
  return $tdList.eq(0).text().trim() + " " + $tdList.eq(8).text().trim();
}).get();

// 第二步：按需用任意字符拼接数组
const result = targetArr.join("#");

运行后targetArr就是你需要的["apple 20", "banana 30", "pears 30"]格式数组，后续可以换成任意分隔符调用join拼接。

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