[已解决]浏览器插件咋写

FishC

wp231957 发表于 2024-07-18 13:51
good
再添加一些
1.A B C 三列  自适应宽度
2、为 ...

明白了，下面我会提供一个完整的 Python 代码示例，展示如何使用 pandas 和 openpyxl 进行以下操作：

1. 从 CSV 文件读取数据，并允许自定义表头。
2. 对第一列序号进行重新赋值，从 1 开始排序。
3. 设置 A、B、C 三列的宽度为自适应。
4. 为数据区域添加表格框线。

首先，确保你已经安装了 pandas 和 openpyxl 库。如果还没有安装，可以通过以下命令进行安装：

1. pip install pandas openpyxl

复制代码

然后使用以下代码：

1. import pandas as pd
   
2. from openpyxl import Workbook
   
3. from openpyxl.utils.dataframe import dataframe_to_rows
   
4. from openpyxl.styles import Border, Side
   
5. from openpyxl.utils import get_column_letter
   
6. 
   
7. # 读取 CSV 文件，允许自定义表头
   
8. def read_csv_with_header(file_path, custom_header=None):
   
9.     if custom_header is not None:
   
10.         df = pd.read_csv(file_path, header=None)
    
11.         df.columns = custom_header
    
12.     else:
    
13.         df = pd.read_csv(file_path)
    
14.     return df
    
15. 
    
16. # 示例 CSV 文件路径和自定义表头
    
17. csv_file_path = 'data.csv'
    
18. custom_header = ['A', 'B', 'C']  # 自定义表头
    
19. 
    
20. # 读取 CSV 文件
    
21. df = read_csv_with_header(csv_file_path, custom_header)
    
22. 
    
23. # 添加或重新赋值序号列
    
24. df.insert(0, '序号', range(1, len(df) + 1))
    
25. 
    
26. # 创建一个新的 Excel 工作簿
    
27. wb = Workbook()
    
28. ws = wb.active
    
29. 
    
30. # 将 DataFrame 写入 Excel 工作表
    
31. for r in dataframe_to_rows(df, index=False, header=True):
    
32.     ws.append(r)
    
33. 
    
34. # 自适应 A、B、C 三列宽度
    
35. for col in ['A', 'B', 'C']:
    
36.     max_length = 0
    
37.     column = ws[col]
    
38.     for cell in column:
    
39.         try:
    
40.             if len(str(cell.value)) > max_length:
    
41.                 max_length = len(cell.value)
    
42.         except:
    
43.             pass
    
44.     adjusted_width = (max_length + 2)
    
45.     ws.column_dimensions[col].width = adjusted_width
    
46. 
    
47. # 为表格添加框线
    
48. thin_border = Border(left=Side(style='thin'),
    
49.                      right=Side(style='thin'),
    
50.                      top=Side(style='thin'),
    
51.                      bottom=Side(style='thin'))
    
52. 
    
53. for row in ws.iter_rows(min_row=1, max_row=ws.max_row, min_col=1, max_col=ws.max_column):
    
54.     for cell in row:
    
55.         cell.border = thin_border
    
56. 
    
57. # 保存 Excel 文件
    
58. excel_file_path = 'output.xlsx'
    
59. wb.save(excel_file_path)
    
60. 
    
61. print(f"Excel 文件已保存到 {excel_file_path}")

复制代码

### 代码解释：
1. **读取 CSV 文件**：定义了 `read_csv_with_header` 函数来读取 CSV 文件，并允许用户传递自定义表头。
2. **序号列重新赋值**：通过 `df.insert` 方法在数据框的第一列插入序号列，序号从 1 开始。
3. **创建 Excel 工作簿**：使用 openpyxl 创建一个新的 Excel 工作簿，并将 DataFrame 写入工作表。
4. **自适应列宽**：遍历 A、B、C 三列，计算每列的最大字符长度并设置相应的列宽。
5. **添加表格框线**：为数据区域添加边框。
6. **保存 Excel 文件**：将最终的 Excel 文件保存到指定路径。

这样，你的 Excel 文件就有了自定义表头、序号列重新排序、自适应宽度以及表格框线。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。

wp231957

FishC 发表于 2024-7-18 13:52
明白了，下面我会提供一个完整的 Python 代码示例，展示如何使用 pandas 和 openpyxl 进行以下操作：
...

这是我另一个页面遇到的问题，这个页面比较简单  没有什么动态加载  也没有什么iframe
我用document.querySelectorAll("table")[1]  就可以检索到表格数据
但是 我想要的数据   都被他在td 下面 又用div包裹了一层     请问，这样 要取1 2 3 列数据  该
如何写油猴脚本

FishC

wp231957 发表于 2024-07-19 09:56
这是我另一个页面遇到的问题，这个页面比较简单  没有 ...

明白了，我们要编写一个油猴脚本（Tampermonkey）来从网页表格中提取数据，特别是那些被 `div` 标签包裹的 `td` 元素中的数据。

以下是一个简单的油猴脚本示例，它会提取指定列的数据:

1. // ==UserScript==
   
2. // @name         Table Data Extractor
   
3. // @namespace    http://tampermonkey.net/
   
4. // @version      0.1
   
5. // @description  Extract specific columns from table
   
6. // @author       You
   
7. // @match        http(s)://*/*
   
8. // @grant        none
   
9. // ==/UserScript==
   
10. 
    
11. (function() {
    
12.     'use strict';
    
13. 
    
14.     // 获取所有表格
    
15.     const tables = document.querySelectorAll("table");
    
16. 
    
17.     // 遍历所有表格
    
18.     tables.forEach((table, tableIndex) => {
    
19.         let data = [];
    
20. 
    
21.         // 获取表格所有行
    
22.         const rows = table.querySelectorAll('tr');
    
23.         
    
24.         rows.forEach((row, rowIndex) => {
    
25.             // 创建一个数组来存储这一行的选定列数据
    
26.             let rowData = [];
    
27. 
    
28.             // 获取行内所有单元格 (td)
    
29.             const cells = row.querySelectorAll('td');
    
30.             
    
31.             // 提取第1，2，3列的数据
    
32.             [0, 1, 2].forEach(colIndex => {
    
33.                 if (cells[colIndex]) {
    
34.                     // 获取包裹在 div 内的文本
    
35.                     const cellText = cells[colIndex].querySelector('div') ? cells[colIndex].querySelector('div').innerText : cells[colIndex].innerText;
    
36. 
    
37.                     // 添加到 rowData 数组
    
38.                     rowData.push(cellText);
    
39.                 }
    
40.             });
    
41. 
    
42.             // 将 rowData 添加到 data 数组
    
43.             if (rowData.length > 0) {
    
44.                 data.push(rowData);
    
45.             }
    
46.         });
    
47. 
    
48.         console.log(`Table ${tableIndex + 1} Data:`, data);
    
49.     });
    
50. })();

复制代码

### 脚本解析

1. **元数据块**：
   - 这部分包含一些油猴脚本的基础信息，如名称、作者、版本、匹配的URL等。

2. **核心函数**：
   - `const tables = document.querySelectorAll("table");`: 获取页面上的所有表格。
   - 遍历每个表格和其内部的行和单元格。
   - 使用 `querySelector('div')` 提取包裹在 `div` 内的文本内容。如果 `div` 不存在，则提取 `td` 的直接文本内容。
   - 将第1，2，3列的数据存储到 `rowData` 数组，并逐行添加到 `data` 数组中。

3. **日志输出**：
   - 使用 `console.log` 输出提取的数据，可以使用浏览器开发者工具查看。

这个脚本已经设置为提取每行的前3列数据，如果需要更多或不同的列，只需调整 `[0, 1, 2]` 中的索引即可。希望这个示例能帮助到你！如果有其他问题，随时提问哦。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。

wp231957

FishC 发表于 2024-7-19 09:59
明白了，我们要编写一个油猴脚本（Tampermonkey）来从网页表格中提取数据，特别是那些被 `div` 标签包 ...

麻烦按照这个格式写，最后要导csv的

// ==UserScript==
// @name         导出网页信息到文件
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  导出当前网页中的部分信息到CSV文件
// @author       wp231957
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 创建导出按钮
    const button = document.createElement('button');
    button.textContent = '导出表格数据2';
    button.style.position = 'fixed';
    button.style.top = '10px';
    button.style.right = '10px';
    button.style.zIndex = 2000;  // 确保按钮在其它元素之上
    document.body.appendChild(button);

    button.addEventListener('click', () => {
        // 找到你需要的表格和列，比如提取第1和第3列（索引从0开始）
        const rows = Array.from(document.querySelectorAll('table tbody tr'));

        // 调试用弹窗，检查提取到的行
        alert('提取到的行数:' + rows.length);

        const data = rows.map(row => {
            const cells = row.querySelectorAll('td');
            if (cells.length >= 3) {  // 确保有至少3个单元格
                return [cells[0].textContent,cells[1].textContent, cells[2].textContent]; // 提取第1和第3列
            }
            return [];
        });

        // 将数据转换为CSV格式
        const csvContent = "data:text/csv;charset=utf-8," + data.map(e => e.join(",")).join("\n");

        // 创建下载链接
        const encodedUri = encodeURI(csvContent);
        const link = document.createElement("a");
        link.setAttribute("href", encodedUri);
        link.setAttribute("download", "table_data2.csv");
        document.body.appendChild(link);

        // 点击下载链接
        link.click();

        // 清除下载链接
        document.body.removeChild(link);
    });
})();

FishC

wp231957 发表于 2024-07-19 10:01
麻烦按照这个格式写，最后要导csv的

// ==UserScri ...

好的，让我们来编写这个油猴脚本。该脚本将从网页中的表格中提取数据，并将其导出为 CSV 文件。我们需要按照以下步骤进行：

1. 创建一个按钮，用于触发数据导出。
2. 找到表格和相关列的数据。
3. 将数据转换为 CSV 格式。
4. 生成一个下载链接，点击后触发 CSV 下载。

以下是完整的油猴脚本代码：

1. // ==UserScript==
   
2. // @name         导出网页信息到文件
   
3. // @namespace    http://tampermonkey.net/
   
4. // @version      0.1
   
5. // @description  导出当前网页中的部分信息到CSV文件
   
6. // @author       wp231957
   
7. // @match        *://*/*
   
8. // @grant        none
   
9. // ==/UserScript==
   
10. 
    
11. (function() {
    
12.     'use strict';
    
13. 
    
14.     // 创建导出按钮
    
15.     const button = document.createElement('button');
    
16.     button.textContent = '导出表格数据';
    
17.     button.style.position = 'fixed';
    
18.     button.style.top = '10px';
    
19.     button.style.right = '10px';
    
20.     button.style.zIndex = 2000;  // 确保按钮在其它元素之上
    
21.     document.body.appendChild(button);
    
22. 
    
23.     button.addEventListener('click', () => {
    
24.         // 找到你需要的表格和列
    
25.         const rows = Array.from(document.querySelectorAll('table tbody tr'));
    
26. 
    
27.         // 提取每行的第1、2和3列数据（假设要取的列数是固定的）
    
28.         const data = rows.map(row => {
    
29.             const cells = row.querySelectorAll('td div');
    
30.             if (cells.length >= 3) {  // 确保有至少3个单元格包裹div
    
31.                 return [cells[0].textContent.trim(), cells[1].textContent.trim(), cells[2].textContent.trim()];
    
32.             }
    
33.             return [];
    
34.         }).filter(row => row.length > 0);  // 过滤掉空行
    
35. 
    
36.         // 将数据转换为CSV格式
    
37.         const csvContent = "data:text/csv;charset=utf-8," + data.map(e => e.join(",")).join("\n");
    
38. 
    
39.         // 创建下载链接
    
40.         const encodedUri = encodeURI(csvContent);
    
41.         const link = document.createElement("a");
    
42.         link.setAttribute("href", encodedUri);
    
43.         link.setAttribute("download", "table_data.csv");
    
44.         document.body.appendChild(link);
    
45. 
    
46.         // 点击下载链接
    
47.         link.click();
    
48. 
    
49.         // 清除下载链接
    
50.         document.body.removeChild(link);
    
51.     });
    
52. })();

复制代码

### 解释：
1. **创建按钮**：
   - 在页面上固定位置创建一个按钮，用户点击之后会触发数据导出功能。

2. **查找表格行和单元格**：
   - 使用 `document.querySelectorAll('table tbody tr')` 找到表格的所有行。
   - 对于每一行，使用 `row.querySelectorAll('td div')` 查找所有单元格内的 `div` 元素。

3. **提取数据**：
   - 从每个单元格的 `div` 中提取第1、2和3列的数据。
   - 使用 `.trim()` 去除多余的空格以保证数据干净。

4. **生成 CSV**：
   - 将提取的数据转换为 CSV 格式，并创建一个下载链接。
   - 自动点击下载链接，以便用户可以直接下载 CSV 文件。

希望这个脚本能帮助你顺利导出表格数据！如果有其他需求或者问题，随时欢迎提问！

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。