当我将鼠标焦点放在元素上时，mouseenter和mouseleave会一直触发

const element = document.querySelector('#your-element');

element.addEventListener('mouseover', () => {
  console.log('Mouse over');
});

element.addEventListener('mouseout', () => {
  console.log('Mouse out');
});

const element = document.querySelector('#your-element');

element.addEventListener('pointerenter', () => {
  console.log('Pointer enter');
});

element.addEventListener('pointerleave', () => {
  console.log('Pointer leave');
});

const element = document.querySelector('#your-element');
let isMouseInside = false;

element.addEventListener('mouseenter', () => {
  isMouseInside = true;
  console.log('Mouse enter');
});

element.addEventListener('mouseleave', () => {
  isMouseInside = false;
  console.log('Mouse leave');
});

element.addEventListener('mousemove', (event) => {
  if (isMouseInside && event.target !== element) {
    isMouseInside = false;
    console.log('Mouse left the element');
  } else if (!isMouseInside && event.target === element) {
    isMouseInside = true;
    console.log('Mouse entered the element');
  }
});