Hướng dẫn javascript export table to csv - bảng xuất javascript sang csv

Tôi đang cố gắng thêm một tính năng của tùy chọn tải xuống CSV trong trang web của mình. Nó sẽ chuyển đổi bảng HTML có trong trang web thành nội dung CSV và làm cho nó có thể tải xuống. Tôi đã tìm kiếm thông qua internet cho một plugin tốt và tìm thấy một số loại hữu ích như //www.dev-skills.com/export-html-table-to-csv-file/ Nhưng nó sử dụng tập lệnh PHP để thực hiện phần tải xuống. Tôi đã tự hỏi nếu có một thư viện JavaScript thuần túy có sẵn để thực hiện tính năng này bằng cách sử dụng các phần mềm phía máy chủ như Node.js mà không sử dụng PHP ??

Download as CSV

Tệp CSV được hẹn giờ và tương thích với định dạng Excel mặc định.

Cập nhật sau khi nhận xét: Đã thêm tham số thứ hai "Dấu tách", nó có thể được sử dụng để định cấu hình một ký tự khác như

Download as CSV
8, thật hữu ích nếu bạn có người dùng tải xuống CSV của mình ở các khu vực khác nhau trên thế giới vì chúng có thể sử dụng một dấu phân cách mặc định khác cho Excel, để biết thêm thông tin Xem: //superuser.com/a/606274/908273

Đã trả lời ngày 30 tháng 5 năm 2019 lúc 1:16May 30, 2019 at 1:16

Download as CSV 9, Vanilla

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
0 và Thư viện
 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
1:

export-to-html-table-as-csv-file-using-jquery

Đặt mã này vào một tập lệnh để được tải trong phần

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
2:

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]

Notes:

Yêu cầu JQuery và Bảng2CSV: Thêm tài liệu tham khảo tập lệnh vào cả hai thư viện trước tập lệnh ở trên.

Bộ chọn

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
3 được sử dụng làm ví dụ và có thể được điều chỉnh để phù hợp với nhu cầu của bạn.

Nó chỉ hoạt động trong các trình duyệt với hỗ trợ

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
4 đầy đủ: Firefox, Chrome và Opera, không phải trong IE, chỉ hỗ trợ
 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
5 để nhúng dữ liệu hình ảnh nhị phân vào một trang.

Đối với khả năng tương thích trình duyệt đầy đủ, bạn sẽ phải sử dụng một cách tiếp cận hơi khác, yêu cầu tập lệnh phía máy chủ để

 $[document].ready[function [] {
    $['table'].each[function [] {
        var $table = $[this];

        var $button = $[""];
        $button.text["Export to spreadsheet"];
        $button.insertAfter[$table];

        $button.click[function [] {
            var csv = $table.table2CSV[{
                delivery: 'value'
            }];
            window.location.href = 'data:text/csv;charset=UTF-8,' 
            + encodeURIComponent[csv];
        }];
    }];
}]
6 CSV.

Đã trả lời ngày 21 tháng 3 năm 2013 lúc 17:27Mar 21, 2013 at 17:27

jordiburgos.com and GitHub.

Test page


Export to Excel
Export to CSV
Column 1 Column "cool" 2 Column 3
100,111 200 300
400 500 600
Text More text Text with new line

Nó rất dễ sử dụng điều này vì tôi đã thử hầu hết các phương pháp khác.

Example

Để tạo nội dung, nhận các giá trị từ bảng, bạn có thể sử dụng TABE2CSV được đề cập bởi Melanciauk và DO:

var csv = $table.table2CSV[{delivery:'value'}];
window.location.href = 'data:application/csv;charset=UTF-8,' + encodeURIComponent[csv];

jordiburgos.com and GitHub.

Test page


Export to Excel
Export to CSV
Column 1 Column "cool" 2 Column 3
100,111 200 300
400 500 600
Text More text Text with new line
0 của tôi. Đã thêm ý kiến ​​vào những gì hầu hết các chức năng/phương pháp làm.

Download as CSV
1

Khi người dùng nhấp vào Xuất sang CSV, nó kích hoạt chức năng sau trong React.

Download as CSV
2

Ví dụ Bảng HTML elems.

Download as CSV
3

Đã trả lời ngày 3 tháng 1 năm 2019 lúc 18:55Jan 3, 2019 at 18:55

Download as CSV 4

Chỉnh sửa: clonenode [] được cập nhật lên clonenode [true] để có được bên trong

Đã trả lời ngày 9 tháng 1 năm 2021 lúc 5:34Jan 9, 2021 at 5:34

Download as CSV 5

Bật nút bằng cách thêm các tập lệnh như:

Download as CSV
6

Vì một số lý do, xuất khẩu Excel dẫn đến tập tin bị hỏng, nhưng có thể được sửa chữa. Ngoài ra, vô hiệu hóa Excel và sử dụng xuất CSV.

Đã trả lời ngày 3 tháng 12 năm 2015 lúc 20:23Dec 3, 2015 at 20:23

Jzhoujzhoujzhou

Phù hiệu bằng đồng 911 Huy hiệu đồng1 silver badge2 bronze badges

0

Tôi đã sử dụng chức năng của Calumah được đăng ở trên, nhưng tôi đã gặp phải một vấn đề với mã của anh ấy như là thơ.

Các hàng được nối với một dấu chấm phẩy

Download as CSV
7

Nhưng liên kết được tạo có "Text/CSV" là loại nội dung

Có thể trong Windows không phải là vấn đề, nhưng trong Excel cho Mac đã loại bỏ mọi thứ. Tôi đã thay đổi mảng tham gia thành dấu phẩy và nó hoạt động hoàn hảo.

Đã trả lời ngày 27 tháng 2 năm 2020 lúc 21:08Feb 27, 2020 at 21:08

Bài Viết Liên Quan

Chủ Đề