JavaScript：当本地存储中的数据更新时，如何更新html表单元格的值？

我有一个单独的javascript代码，它从api获取数据并插入浏览器localStorage

API正在获取ETA数据并将其作为

id_ETA

（例如12342_ETA）键保存在本地存储器中

当本地存储中的值得到更新时，我的html表ETA列值也应该得到更新，而不刷新页面

现在我需要刷新整个页面，以便在html中查看更新的ETA

HTML表格：

<div class="container">     
    <table class="table">
    <thead>
    <tr>
    <th>Id</th>
    <th>Arrival Address</th>
    <th>Departure Address</th>
    <th>ETA</th>
    </tr>
    </thead>
    <tbody>

<script>

var data = getPlanData(); 
<div class="container">     
<table class="table">
<thead>
<tr>
<th>Id</th>
<th>Arrival Address</th>
<th>Departure Address</th>
<th>ETA</th>
</tr>
</thead>
<tbody>

for(var i=0;i<data.length;i++){
document.write("<tr>");
document.write("<td>"+data[i]['id']+"</td>");
document.write("<td>"+data[i]['arrival']+"</td>");
document.write("<td>"+data[i]['departure']+"</td>");
document.write("<td>"+data[i]['arrival']+"</td>");
if (localStorage.getItem(data[i]['id']+'_ETA'))
{
document.write("<td>"+localStorage.getItem(data[i]['id']+'_ETA')+"</td>");
}
else
{
document.write("<td>-</td>");
}
document.write("</tr>");
</script>
</tbody>
</table>
</div>

注：ETA来自单独的API 当localStorage中有新的ETA值时，是否有方法在不刷新页面的情况下更新ETA列？

假设getPlanData（）写入localStorage，您需要做两件事

不要使用document.write，当然不要在加载后使用，因为它会擦除页面

保存到getPlanData（）中的localStorage，然后

使用getPlanData函数中的数据调用此更新-此脚本可以复制到脚本标记内的文档头部，称为

update（data）

const update=data=>{
const html=data.map（项=>(
`
${item.id}
${item.arrival}
${item.deposition}
${item.arrival}
${localStorage.getItem（item.id+“_ETA”）| |“-”}
`));
document.querySelector（“.table tbody”）.innerHTML=html.join（“”）
}  

身份证件
到达地址
出发地址
希腊字母表的第7个字母

如果您发布了一个数据示例，我相信我们可以找到比

localStorage.getItem（item.id+“_ETA”）

更新：你能做到吗

var data = getPlanData(); 
update(data)

---

请你更新一下你的例子好吗？它目前充满了错误。确保它是一个。另外，请发布getPlanData（）-那么什么是写入本地存储呢。我还以为是getPlanData。请张贴所有相关代码

var data = getPlanData(); 
update(data)