如何使用jQuery nextUntil筛选出特定行之后直到单元格数量不同的后续行？-css教程-PHP中文网

如何使用jQuery nextUntil筛选出特定行之后直到单元格数量不同的后续行？

聖光之護

发布： 2025-02-20 08:18:01

原创

966人浏览过

如何使用jquery nextuntil筛选出特定行之后直到单元格数量不同的后续行？

利用jQuery nextUntil筛选特定行后的后续行

本文探讨如何使用jQuery的nextUntil函数，从一系列单元格数量相同的相邻行中，筛选出特定行之后直到遇到单元格数量不同的行为止的所有行。

方案一：基于nextUntil的迭代筛选

此方法通过迭代查找包含特定数量单元格的行，然后使用nextUntil找到其后的所有符合条件的行。

行者AI

行者AI绘图创作，唤醒新的灵感，创造更多可能

100

查看详情

<code class="javascript">const rows = $('tr'); // 获取所有行
const rowsWithFourCells = rows.filter(function() {
  return $(this).find('td').length === 4; // 筛选出包含4个单元格的行
});

const result = rowsWithFourCells.map(function(index) {
  const currentRow = $(this);
  const nextRows = currentRow.nextUntil(rowsWithFourCells.eq(index + 1) || rows.last()); // 筛选直到下一个包含4个单元格的行或最后一行
  return {
    startRow: currentRow,
    subsequentRows: nextRows
  };
}).get(); // 将结果转换为数组

console.log(result);</code>

登录后复制

方案二：递归方法

此方法采用递归函数，逐行检查单元格数量，直到遇到不符合条件的行。

<code class="javascript">function findSubsequentRows(startRow) {
  let currentRow = startRow.next();
  const subsequentRows = [];

  while (currentRow.length > 0 && currentRow.find('td').length === 2) { // 假设目标行包含2个单元格
    subsequentRows.push(currentRow);
    currentRow = currentRow.next();
  }

  return subsequentRows;
}

const rowsWithTwoCells = $('tr').filter(function() {
  return $(this).find('td').length === 2;
});

const results = rowsWithTwoCells.map(function() {
  return findSubsequentRows($(this));
}).get();

console.log(results);</code>

登录后复制

两种方法都实现了目标，选择哪种方法取决于具体需求和代码风格偏好。第一种方法更简洁，直接利用nextUntil；第二种方法更灵活，可以根据需要修改递归条件。请根据实际HTML结构调整代码中单元格数量的判断条件（例如=== 4 或 === 2）。

以上就是如何使用jQuery nextUntil筛选出特定行之后直到单元格数量不同的后续行？的详细内容，更多请关注php中文网其它相关文章！