修改HTML表格分页data-vpp参数获取更多数据的技术求助

一、修改data-vpp参数的可行性 #

完全可以尝试，操作步骤如下：

1. 按下F12打开浏览器开发者工具，切换到「Elements」标签；
2. 定位到你提供的这个按钮元素，双击data-vpp="15"的属性值，改成更大的数字（比如直接填28186对应总条数，或者先试100、500这类中间值）；
3. 修改完成后，点击该按钮（或右键选「Inspect」后，在控制台执行$0.click()触发点击），观察页面是否加载更多数据。

注意：如果后端接口对每页返回条数做了上限限制（比如最多允许每页100条），修改超过上限的数值只会返回后端允许的最大条数，此时需要换其他方法。

二、其他批量获取数据的方法 #

1. 直接调用分页接口抓取全量数据 #

1. 打开开发者工具的「Network」标签，点击「older」按钮，找到触发的XHR/fetch请求；
2. 查看请求参数（一般在Query String或Request Body里），找到类似vpp=15、page=xxx的参数；
3. 修改vpp为更大的数值（或直接请求所有页的数据，如果接口支持page=all这类参数），再将返回的JSON数据导出整理成表格。

2. 用浏览器控制台脚本自动翻页收集数据 #

复制以下脚本到浏览器控制台（F12切换到「Console」标签），回车执行即可自动翻页并导出所有数据为CSV文件：

// 自动翻页收集表格数据并导出CSV
let allData = [];
const processPage = async () => {
  // 获取当前页表格行（需跳过表头可改成document.querySelectorAll('table tr:not(:first-child)')）
  const rows = document.querySelectorAll('table tr');
  rows.forEach(row => {
    const rowData = Array.from(row.cells).map(cell => cell.textContent.trim().replace(/,/g, '，'));
    allData.push(rowData);
  });
  
  const olderBtn = document.querySelector('button.ii__votes_btn[data-page="-1"]');
  if (olderBtn && !olderBtn.classList.contains('disabled')) {
    // 等待1秒确保数据加载完成，可根据实际情况调整时长
    await new Promise(resolve => setTimeout(resolve, 1000));
    olderBtn.click();
    setTimeout(processPage, 1000);
  } else {
    // 导出CSV
    const csvContent = allData.map(row => row.join(',')).join('\n');
    const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = 'full-table-data.csv';
    link.click();
  }
};
// 启动脚本
processPage();

提示：如果按钮选择器不对，可根据页面实际元素调整document.querySelector里的选择器。

3. 浏览器扩展辅助导出 #

如果不想写代码，可尝试安装表格导出类扩展（比如「TableExport」），但这类扩展一般需要页面加载完所有数据才能导出全量，可能需要配合自动翻页脚本使用。

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