如何使用数组将具有id的PHP表值链接到javascript？

Question

让我解释一下我的问题/任务：

1）我有一个PHP表，显示某个日期和时间的温度，并带有天气预报中的API。2）工作是：用Java将该表转换为折线图。3）我需要在PHP表和我的Javascript代码之间创建一个链接。但是我该如何使用“数组”呢？4）我当前的方法：在PHP表中的每个td行使用一个id标记。接下来，进行一个for循环，该循环检查PHP表40次（我需要用于图表的数据点的数量），以收集下一个td行（不幸的是，我得到了40倍的相同值）。

简短地说，我如何使用表格数据并使其在Javascript中“可用”，从而以可视化方式表示温度来创建折线图。

在这里您可以找到我当前使用PHP和Javascript编写的代码。任何反馈，帮助或建议都非常欢迎！预先感谢您！

PHP部分用于循环：

echo "<table>";

for ($j=0; $j < 40 ; $j++) { 

    echo "<tr>";
    echo "<td id=Temp>{$data->list[$j]->main->temp}</td>";
    echo "<td id=Datum>{$data->list[$j]->dt_txt}</td";
    echo "</tr>";
}

echo "</table>";

Javascript：

var temp = new Array();
var datum = new Array();

for (var i=0; i < 40 ; i++) { 

   temp[i] = document.getElementById("Temp").innerText;
   datum[i] = document.getElementById("Datum").innerText;

}

Greetz，C。

Answer 1

ID必须是唯一的，您不能在每行上都具有相同的id=Temp和id=Datum。您应该使用一个类。然后，您可以使用该类遍历所有元素。

PHP：

echo "<table>";

for ($j=0; $j < 40 ; $j++) { 

    echo "<tr>";
    echo "<td class="Temp">{$data->list[$j]->main->temp}</td>";
    echo "<td class="Datum">{$data->list[$j]->dt_txt}</td";
    echo "</tr>";
}

echo "</table>";

JS：

var temp = Array.from(document.querySelectorAll(".Temp")).map(el => el.innerText);
var datum = Array.from(document.querySelectorAll(".Datum")).map(el => el.innerText);