如何悬停每条条的总和

<ul id="item-list">
  <li class="item">条目1</li>
  <li class="item">条目2</li>
  <li class="item">条目3</li>
  <!-- 其他条目 -->
</ul>

<div id="total-container"></div>

.item {
  /* 条目样式 */
}

#total-container {
  display: none; /* 初始隐藏总和容器 */
  /* 总和容器样式 */
}

var itemList = document.querySelectorAll('.item');
var totalContainer = document.getElementById('total-container');

itemList.forEach(function(item) {
  item.addEventListener('mouseover', function() {
    var total = calculateTotal(itemList);
    totalContainer.textContent = '总和：' + total;
    totalContainer.style.display = 'block';
  });

  item.addEventListener('mouseout', function() {
    totalContainer.style.display = 'none';
  });
});

function calculateTotal(items) {
  var total = 0;
  items.forEach(function(item) {
    total += parseInt(item.textContent);
  });
  return total;
}