我已经创建了一个网站，使用HTML模板。我可以创建网站，一切都显示正确。但我如何更新模板内的值创建后？
HTML部件

...
<div class="row block-column align-items-center justify-content-center"></div>
<template id="DEVICE_TEMPLATE">
    <div class="col-2 col-xl-2"  align="center">
      <a class="tDeviceHref " >
        <img class="tDeviceImg" src="" height="50px" width="50px" title="">
      </a>
    </div>
    <div class="col-10 col-xl-4 "">
      <div class="devicePicture" align="center">
        <a class="tDeviceLabel  text-left" >Name</a>
      </div>
      <div class="progress" style="height: 25px;">
        <div id="opwnwblp1" style="width: 100%;" class="bg-secondary progress-bar progress-bar-animated progress-bar-striped">
          <div class="tDeviceVerbrauch "></div>
        </div>
      </div>
    </div>
</template>
...

这是JS部分：

function createGui(devices){
  const templ = document.querySelector("#DEVICE_TEMPLATE")
  for (var i = 0; i < allDeviceGroups.length; i++) {
    // ...
    const clone = templ.content.cloneNode(true);
    clone.querySelector(".tDeviceImg").src = groupDevice["DEVICE"]["img"]["imgRunning"];
    document.querySelector(".block-column").append(clone);
    // ...
  }
}

上面的代码只是一个洞的一部分，有更多的设置到模板，但不相关的问题。
如果我重新加载createGui函数，gui将一次又一次地追加阿索。我喜欢只刷新部分的值，比如为

clone.querySelector(".tDeviceImg").src = groupDevice["DEVICE"]["img"]["imgRunning"];