Pound symbol (£) encoding issue while converting an HTML table into CSV using JavaScript

Question

I am using pound symbol(£) in table head(th) and i am exporting the table in CSV format using javascript. But the CSV file is showing the pound(£) symbol like "£". I tried various solutions provided in SO threads. But none of them worked for me. How can I fix this issue?

Below is the code of the table:

<thead> 
     <tr> 
      <th>Property Name</th > 
      <th>Description</th > 
      <th>Category</th> 
      <th>Sub category</th> 
      <th>Amount</th>
      <th>Unit</th> 
      <th> £ / Unit</th> 
      <th>Sub Total</th>

     </tr>
    </thead

I am using the below JavaScript function to export the table into CSV.

function exportTableToCSV(filename,userName) {
    var csv = [];
    var rows = document.querySelectorAll("table#"+userName+" tr");
    for (var i = 0; i < rows.length; i++) {

        var row = [], cols = rows[i].querySelectorAll("td, th");

        for (var j = 0; j < cols.length; j++) 
            row.push(cols[j].innerText);
        csv.push(row.join(","));        
    }

    downloadCSV(csv.join("\n"), filename);
}

function downloadCSV(csv, filename) {
    var csvFile;
    var downloadLink;
    csvFile = new Blob([csv], {type: "text/csv"});
    downloadLink = document.createElement("a");
    downloadLink.download = filename;
    downloadLink.href = window.URL.createObjectURL(csvFile);  
    downloadLink.style.display = "none";
    document.body.appendChild(downloadLink);
    downloadLink.click();
}

The output is like the one in the below screenshot.

Answer 1

Can you replace js and check.

function exportTableToCSV(filename, userName) {
  var csv = [];
  var rows = document.querySelectorAll("table#" + userName + " tr");
  for (var i = 0; i < rows.length; i++) {

    var row = [],
      cols = rows[i].querySelectorAll("td, th");

    for (var j = 0; j < cols.length; j++)
      row.push(cols[j].innerText);
    csv.push(row.join(","));
  }

  downloadCSV(csv.join("\n"), filename);
}

function downloadCSV(csv, filename) {
  var csvFile;
  var downloadLink;
  var csvString = csv;
  var universalBOM = "\uFEFF";
  var a = window.document.createElement('a');
  a.setAttribute('href', 'data:text/csv; charset=utf-8,' + encodeURIComponent(universalBOM + csvString));
  a.setAttribute('download', filename);
  window.document.body.appendChild(a);
  a.click();

}

exportTableToCSV('test.csv', 'velu');

<table id="velu">
  <thead>
    <tr>
      <th>Property Name</th>
      <th>Description</th>
      <th>Category</th>
      <th>Sub category</th>
      <th>Amount</th>
      <th>Unit</th>
      <th> £ / Unit</th>
      <th>Sub Total</th>

    </tr>
  </thead>
</table>