如何准确跟踪窗户上的鼠标运动？

Question

现在，我正在通过一种方法来根据鼠标是否向下以及鼠标是否超过元素来更新元素状态。这意味着，一旦鼠标向下，每次鼠标悬停在其中一个元素上时，状态就会发生变化。跟踪是不准确的，它不会捕获每个动作。我如何改善过程？
我目前的暗示代码是：

document.onmousedown = () => {
      document.onmousemove = (e) => {
        if (e.buttons === 1) {
          let svg = e.target as HTMLElement;
          if (svg.id.startsWith('svg')) {
            let SVG_ID = svg.id;
            let HoverPropsID = svg.id.replace('svg', 'props');
            if (document.getElementById(HoverPropsID).classList.contains('no-node')) {
              toRemove.forEach(element => document.getElementById(SVG_ID).classList.remove(element));
              document.getElementById(SVG_ID).classList.add(`svg-${node}`);
              document.getElementById(HoverPropsID).classList.remove('no-node');
              document.getElementById(HoverPropsID).classList.add(node);
              multiNodeGraphUpdate(node, Number(HoverPropsID.substring(HoverPropsID.lastIndexOf('-') + 1)), 10, false)
            }
            nodeHoverAnimation(HoverPropsID);
          }
        }
      }

我了解我提供的信息可能是一个很大的模棱两可，因此我链接了两个网站，一个是灵感网站： https://clementmihailescu.github.io/pathfinding-visalizer/

，另一个是Wip webiste（我自己）： https://aarnavv.github.io/vagus/