Преобразование текста CSV на экране в таблицу

У меня есть класс div, который содержит необработанный текст для csv ниже:

<div class = "weh">
    Jones, Smith, and Company
    test, meow
</div>

Есть ли способ загрузить этот div и отобразить его в виде таблицы, а не просто необработанного текста на рендере HTML?

Я нашел этот код, который работает ниже, но он работает только для загрузки реального файла. Как я могу изменить его, чтобы загрузить то, что находится в моем классе div, и загрузить таблицу стилей csv под ним.

<script src = "http://d3js.org/d3.v3.min.js" charset = "utf-8"></script>
<style>
    table {
        border-collapse: collapse;
        border: 2px black solid;
        font: 12px sans-serif;
    }

    td {
        border: 1px black solid;
        padding: 5px;
    }
</style>
<script type = "text/javascript"charset = "utf-8">

      d3.text("excel.csv", function(data) {
          var parsedCSV = d3.csv.parseRows(data);

          var container = d3.select(".module-content")
              .append("table")

              .selectAll("tr")
                  .data(parsedCSV).enter()
                  .append("tr")

              .selectAll("td")
                  .data(function(d) { return d; }).enter()
                  .append("td")
                  .text(function(d) { return d; });
      });
  </script>
Как конвертировать HTML в PDF с помощью jsPDF
Как конвертировать HTML в PDF с помощью jsPDF
В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.
0
0
17
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Просто извлеките текст из DOM

var csvText = d3.select("#weh").text();

var csvText = d3.select("#weh").text();
console.info(csvText);
var parsedCSV = d3.csv.parseRows(csvText);
console.info(parsedCSV);
var container = d3.select("body")
    .append("table")

    .selectAll("tr")
      .data(parsedCSV).enter()
      .append("tr")

    .selectAll("td")
      .data(function(d) { return d; }).enter()
      .append("td")
        .text(function(d) { return d; });
table, td { border: 1px solid #000000; }
td { padding: 0.5em; }
<script src = "http://d3js.org/d3.v3.min.js" charset = "utf-8"></script>

<div id = "weh" style = "display:none;">Jones,Smith,Company
test,meow,foofoo
</div>

Другие вопросы по теме