javascript - 如何在 JavaScript 中读取 html 表格列表

Question

我有一个由 pandas 数据框给出的 HTML 表格列表，格式如下:

list_html = 
[<table border="1" class="dataframe">
 <thead>
<tr style="text-align: right;">
  <th></th>
  <th>score</th>
  <th>id</th>
  <th>name</th>
</tr>
  </thead>
 <tbody>
<tr>
   <th>0</th>
  <td>0.776959</td>
  <td>grade</td>
  <td>grade</td>
</tr>
<tr>
  <th>1</th>
  <td>0.414527</td>
  <td>class</td>
  <td>class</td>
</tr>, ... , ... ]

我试图在 html 页面中可视化这些数据，但无法做到。我在网络开发方面没有足够的经验。我的目标是使用 JavaScript 遍历列表中的每个项目，并在 html 中将它们可视化。如果有人能提供帮助，那就太好了!

这是我到目前为止所尝试的，它可能是完全错误的:

var list_html = list_html  // list of html codes as a      javascript variable.
var arrayLength = analysis.length;
for (var i in list_html) {
  document.getElementById("analysis_1").innerHTML = list_html[i];
}

Answer 1

给定一个有效的字符串数组 list_html(实际上 list_html 不是一个有效的字符串数组，因为每个条目中的标记没有用引号引起来)和一个容器在 ID 为“analysis_1”的 DOM 中，这只是一个问题:

var container = document.getElementById('analysis_1');
for (var i = 0; i < list_html.length; i++) {
    container.innerHTML += list_html[i];
}

更新:

好吧......在你的场景中根本不需要循环，你可以通过连接数组中的元素来简单地注入(inject)一个字符串:

document.getElementById('analysis_1').innerHTML = list_html.join('');

快速简单! :)