Làm cách nào để xuất dữ liệu bảng html dưới dạng tệp .csv?

Tôi có bảng dữ liệu trong bảng html trên trang web và cần biết cách xuất dữ liệu đó dưới dạng tệp .csv.Làm cách nào để xuất dữ liệu bảng html dưới dạng tệp .csv?

Điều này sẽ được thực hiện như thế nào?

Nguồn

2011-08-23 fmz

dữ liệu là bao nhiêu? Đây có phải là một công việc hoặc bạn sẽ cần phải chạy nó nhiều lần? –

Chắc chắn bạn sẽ phải phân tích trang và tạo csv theo cách thủ công từ dữ liệu. – Jim

Có thể thấy http://stackoverflow.com/questions/2627162/how-to-convert-html-to-csv –

Để xuất html sang csv, hãy thử làm theo ví dụ sau. Chi tiết và ví dụ khác có sẵn tại ~~author's website~~.

Tạo tệp html2csv.js và đặt mã sau vào trong đó.

jQuery.fn.table2CSV = function(options) { 
    var options = jQuery.extend({ 
     separator: ',', 
     header: [], 
     delivery: 'popup' // popup, value 
    }, 
    options); 

    var csvData = []; 
    var headerArr = []; 
    var el = this; 

    //header 
    var numCols = options.header.length; 
    var tmpRow = []; // construct header avalible array 

    if (numCols > 0) { 
     for (var i = 0; i < numCols; i++) { 
      tmpRow[tmpRow.length] = formatData(options.header[i]); 
     } 
    } else { 
     $(el).filter(':visible').find('th').each(function() { 
      if ($(this).css('display') != 'none') tmpRow[tmpRow.length] = formatData($(this).html()); 
     }); 
    } 

    row2CSV(tmpRow); 

    // actual data 
    $(el).find('tr').each(function() { 
     var tmpRow = []; 
     $(this).filter(':visible').find('td').each(function() { 
      if ($(this).css('display') != 'none') tmpRow[tmpRow.length] = formatData($(this).html()); 
     }); 
     row2CSV(tmpRow); 
    }); 
    if (options.delivery == 'popup') { 
     var mydata = csvData.join('\n'); 
     return popup(mydata); 
    } else { 
     var mydata = csvData.join('\n'); 
     return mydata; 
    } 

    function row2CSV(tmpRow) { 
     var tmp = tmpRow.join('') // to remove any blank rows 
     // alert(tmp); 
     if (tmpRow.length > 0 && tmp != '') { 
      var mystr = tmpRow.join(options.separator); 
      csvData[csvData.length] = mystr; 
     } 
    } 
    function formatData(input) { 
     // replace " with “ 
     var regexp = new RegExp(/["]/g); 
     var output = input.replace(regexp, "“"); 
     //HTML 
     var regexp = new RegExp(/\<[^\<]+\>/g); 
     var output = output.replace(regexp, ""); 
     if (output == "") return ''; 
     return '"' + output + '"'; 
    } 
    function popup(data) { 
     var generator = window.open('', 'csv', 'height=400,width=600'); 
     generator.document.write('<html><head><title>CSV</title>'); 
     generator.document.write('</head><body >'); 
     generator.document.write('<textArea cols=70 rows=15 wrap="off" >'); 
     generator.document.write(data); 
     generator.document.write('</textArea>'); 
     generator.document.write('</body></html>'); 
     generator.document.close(); 
     return true; 
    } 
};

bao gồm các file js vào trang html như thế này:

<script type="text/javascript" src="jquery-1.3.2.js" ></script> 

<script type="text/javascript" src="html2CSV.js" ></script>

TABLE:

<table id="example1" border="1" style="background-color:#FFFFCC" width="0%" cellpadding="3" cellspacing="3"> 

    <tr> 

     <th>Title</th> 

     <th>Name</th> 

     <th>Phone</th> 

    </tr> 

    <tr> 

     <td>Mr.</td> 

     <td>John</td> 

     <td>07868785831</td> 

    </tr> 

    <tr> 

     <td>Miss</td> 

     <td><i>Linda</i></td> 

     <td>0141-2244-5566</td> 

    </tr> 

    <tr> 

     <td>Master</td> 

     <td>Jack</td> 

     <td>0142-1212-1234</td> 

    </tr> 

    <tr> 

     <td>Mr.</td> 

     <td>Bush</td> 

     <td>911-911-911</td> 

    </tr> 

</table>

KHẨU NÚT:

<input value="Export as CSV 2" type="button" onclick="$('#example1').table2CSV({header:['prefix','Employee Name','Contact']})">

Nguồn

2011-08-23 12:51:30 AlphaMale

Xin chào, tôi thực sự đánh giá cao phản hồi nhanh chóng và chi tiết. Tôi đã thử mã của bạn nhưng dường như có một số lỗi trong javascript. Tôi không phải là một guru Javascript vì vậy tôi không biết làm thế nào để sửa chữa nó. – fmz

Thankyou. Nhưng bạn có thể đề cập đến lỗi được không. và cũng cho tôi biết bạn đã thử ví dụ trên trước? – AlphaMale

Điều này làm việc tốt cho tôi. Tôi đang sử dụng jQuery 1.7.2. Cảm ơn rất nhiều! – michaelok

Nếu đó là một nhu cầu không thường xuyên, hãy thử một trong nhiều add-in firefox tạo điều kiện thuận lợi sao chép dữ liệu bảng HTML vào khay nhớ tạm (ví dụ: https://addons.mozilla.org/en-US/firefox/addon/dafizilla-table2clipboard/). Ví dụ, đối với 'table2clipboard' add-on:

cài đặt add-on trong firefox
mở web-page (với bảng) trong firefox
kích chuột phải vào bất cứ nơi nào trong bảng và chọn 'sao chép toàn bộ bảng'
khởi động một ứng dụng bảng tính như LibreOffice Calc
dán vào bảng tính (chọn ký tự phân cách thích hợp khi cần thiết)
tiết kiệm/xuất khẩu bảng tính như CSV.

Nguồn

2012-03-03 01:17:07 dat

Anh ta không muốn cho firefox chỉ ... không tốt ví dụ –

Đây là một thực sự nhanh chóng CoffeeScript/jQuery dụ

csv = [] 
for row in $('#sometable tr') 
    csv.push ("\"#{col.innerText}\"" for col in $(row).find('td,th')).join(',') 
output = csv.join("\n")

Nguồn

2012-08-21 22:20:02

Bạn có thể sử dụng một phần mở rộng cho Chrome, hoạt động tốt những lần tôi đã thử nó.

https://chrome.google.com/webstore/search/html%20table%20to%20csv?_category=extensions

Khi được cài đặt và trên bất kỳ trang web với một bảng nếu bạn click vào biểu tượng của tiện ích này nó cho thấy tất cả các bảng trong trang, làm nổi bật mỗi khi bạn cuộn qua các bảng nó sẽ liệt kê, bấm cho phép bạn sao chép vào khay nhớ tạm hoặc lưu vào Google Tài liệu.

Nó hoạt động hoàn hảo cho những gì tôi cần, thỉnh thoảng chuyển đổi dữ liệu dạng bảng dựa trên web thành bảng tính mà tôi có thể làm việc.

Nguồn

2014-12-13 19:06:52

Tôi đã một thời gian ngắn bao phủ một cách đơn giản để làm điều này với Google Spreadsheets (importHTML) và bằng Python (Pandas read_html và to_csv) cũng như một Python script ví dụ trong tôi SO trả lời ở đây: https://stackoverflow.com/a/28083469/1588795.

Nguồn

2015-01-22 07:39:54 n8henrie

Tôi đã có thể sử dụng câu trả lời được nêu ở đây: Export to CSV using jQuery and html và được thêm vào trong một sửa đổi để làm cho nó hoạt động trong IE và một sửa đổi khác được đề cập trong các ý kiến để lấy thead từ bảng.

function exportTableToCSV($table, filename) { 

    var $rows = $table.find('tr:has(td),tr:has(th)'), 

     // Temporary delimiter characters unlikely to be typed by keyboard 
     // This is to avoid accidentally splitting the actual contents 
     tmpColDelim = String.fromCharCode(11), // vertical tab character 
     tmpRowDelim = String.fromCharCode(0), // null character 

     // actual delimiter characters for CSV format 
     colDelim = '","', 
     rowDelim = '"\r\n"', 

     // Grab text from table into CSV formatted string 
     csv = '"' + $rows.map(function (i, row) { 
      var $row = $(row), $cols = $row.find('td,th'); 

      return $cols.map(function (j, col) { 
       var $col = $(col), text = $col.text(); 

       return text.replace(/"/g, '""'); // escape double quotes 

      }).get().join(tmpColDelim); 

     }).get().join(tmpRowDelim) 
      .split(tmpRowDelim).join(rowDelim) 
      .split(tmpColDelim).join(colDelim) + '"', 



     // Data URI 
     csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv); 

     console.log(csv); 

     if (window.navigator.msSaveBlob) { // IE 10+ 
      //alert('IE' + csv); 
      window.navigator.msSaveOrOpenBlob(new Blob([csv], {type: "text/plain;charset=utf-8;"}), "csvname.csv") 
     } 
     else { 
      $(this).attr({ 'download': filename, 'href': csvData, 'target': '_blank' }); 
     } 
} 

// This must be a hyperlink 
$("#xx").on('click', function (event) { 

    exportTableToCSV.apply(this, [$('#projectSpreadsheet'), 'export.csv']); 

    // IF CSV, don't do event.preventDefault() or return false 
    // We actually need this to be a typical hyperlink 
});

Với liên kết của tôi trông như này ...

<a href="#" id="xx" style="text-decoration:none;color:#000;background-color:#ddd;border:1px solid #ccc;padding:8px;">Export Table data into Excel</a>

JsFiddle: https://jsfiddle.net/mnsinger/65hqxygo/

Nguồn

2015-11-19 15:18:20

câu trả lời tuyệt vời.Cảm ơn bạn đã chia sẻ.Đây là chính xác những gì tôi muốn! – Rymnel

Chính xác những gì tôi cần! Cảm ơn bạn –

Nó hoạt động đẹp! Đơn giản và nhanh chóng! –

Nhờ gene tsai, đây là một số thay đổi mã của mình để chạy trên trang mục tiêu của tôi:

csv = [] 
rows = $('#data tr'); 
for(i =0;i < rows.length;i++) { 
    cells = $(rows[i]).find('td,th'); 
    csv_row = []; 
    for (j=0;j<cells.length;j++) { 
     txt = cells[j].innerText; 
     csv_row.push(txt.replace(",", "-")); 
    } 
    csv.push(csv_row.join(",")); 
} 
output = csv.join("\n")

cải tiến:

Sử dụng chung Javascript for loop
chắc chắn rằng mỗi tế bào không có dấu phẩy

Nguồn

2016-01-20 16:52:18

Làm cách nào để xuất dữ liệu bảng html dưới dạng tệp .csv?

Trả lời

Các vấn đề liên quan