仅刷新一个部分而不刷新整个页面

编程问答 2022-11-06

问题描述

我只想刷新网站的一部分。这只是我从西门子PLC获得的一个价值。我收到了实际的当前值，我想在我的网站上更新它。

HTML看起来像这样：

<table class="tablePowerCurrent">
  <tr>
    <td>
      <p class="Current">:="Var".Point_1.CurrentNow: A</p>
    </td>
      <td>
      <p class="Power">:="Var".Point_1.Power: kWh</p>
    </td>
  </tr>
</table>

现在，我正在使用iframe。此处的表格位于另一个html内，我将其与主html中的iframe一起使用。 iframe具有元刷新功能。

但是现在我想使用脚本或类似的东西来刷新值。

解决方法

最简单的解决方案是放置一个JS脚本，该脚本将调用Siemens PLC服务器并获取

setInterval(function()
{
  // Update the Current value
   $('.Current').load("https://siemens.com/api/call"); 

  // Update the Power value
   $('.Power').load("https://siemens.com/api/call")
   
},100000) // Repeat the refresh every 10sec

请记住，API调用必须返回字符串或单个值，因为代码将用该API调用（数据）获得的响应替换HTML中的div值。 jQuery是必填项

htmljavascriptrefreshweb