通过F12提取网页中的表单数据

• 1、通过CSS选择器（基于位置）：

  # 假设目标列是第三列且所有 <td> 的 class 为 data-class
  td.data-class:nth-child(3)
  # 如果所有行结构一致：
  tr > td.data-class:nth-of-type(3)
  

  2、通过XPath选择

  //td[@class='data-class'][position()=3]
  # 或结合父级定位：
  //tr/td[@class='data-class'][3]
  

• 在控制台提取数据
  1、CSS

  // 获取所有第三列的文本内容
  let cells = document.querySelectorAll('td.data-class:nth-child(3)');
  cells.forEach(cell => console.log(cell.textContent));
  let data = Array.from(cells).map(cell => cell.textContent.trim());
  // 生成下载链接
  const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url;
  a.download = 'output.json';
  a.click();
  URL.revokeObjectURL(url);
  

  2、XPath

  const xpath = '//td[@class="data-class"][3]';
  const result = document.evaluate(xpath, document, null, XPathResult.ANY_TYPE, null);
  let data = [];
  let cell = result.iterateNext();
  while (cell) {
  data.push(cell.textContent.trim());
  cell = result.iterateNext();
  }
  // 生成JSON下载链接
  const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url;
  a.download = 'xpath_output.json';
  a.click();
  URL.revokeObjectURL(url);