使用javascript和thymeleaf获取动态数组的平均值

Question

我在数据表上有一系列元素。我想添加一行来创建这些元素的平均值。

我正在使用thymeleaf和Javascript，但我不知道是否有可能实现这一点。

 <tr th:each="cm, stat : *{measures}">
  <td height="60 px">
    <span th:text="${cm.cylinder.name}"></span>
  </td>
  <td height="60 px">
    <input id="variable1" type="text"
      th:field="*{measures[__${stat.index}__].variable1}" 
      th:class="${#fields.hasErrors('measures[__${stat.index}__].variable1')}? 
      error"required="required" />
  </td>
  <td height="60 px">
    <input id="variable2rack" type="text"
    th:field="*{measures[__${stat.index}__].variable2}"
    th:class="${#fields.hasErrors('measures[__${stat.index}__].variable2')}? error"
    required="required" />
  </td>
  <td height="60 px"><input id="variable3" type="text"
    th:field="*{measures[__${stat.index}__].variable3}"
    th:class="${#fields.hasErrors('measures[__${stat.index}__].variable3')}? error"
    required="required" />
  </td>
</tr>
<tr>
<th>
  <button type="submit" name="Average">Average</button>
</th>
  <td height="40 px"><span>function javascript</span></td>  
  <td height="40 px"><span>function javascript</span></td>  
  <td height="40 px"><span>function javascript</span></td>  
  <td height="40 px"><span>function javascript</span></td>  
</tr>

关于Javascript解决方案我认为这将是我的问题的解决方案，但我不确定是否是最好的方法