js 实现点击事件时，给对应的element添加一个可视反馈

实现代码

function simulateMoveAndClick(element, x, y) {  
    // 创建并分发鼠标移动事件  
    const moveEvent = new MouseEvent('mousemove', {  
        'view': window,  
        'bubbles': true,  
        'cancelable': true,  
        'screenX': x + window.screenX,  
        'screenY': y + window.screenY,  
        'clientX': x,  
        'clientY': y,  
        'ctrlKey': false,  
        'altKey': false,  
        'shiftKey': false,  
        'metaKey': false,  
        'button': 0, // 无按钮按下  
        'relatedTarget': null  
    });  
    element.dispatchEvent(moveEvent);  
  
    // 等待一段时间以模拟真实的鼠标移动（可选）  
     setTimeout(() => {  
         // 创建并分发点击事件  
         const clickEvent = new MouseEvent('click', {  
             'view': window,  
             'bubbles': true,  
            'cancelable': true,  
            'screenX': x + window.screenX,  
             'screenY': y + window.screenY,  
             'clientX': x,  
             'clientY': y,  
             'ctrlKey': false,  
             'altKey': false,  
             'shiftKey': false,  
             'metaKey': false,  
             'button': 0, // 左键点击  
             'relatedTarget': null  
         });  
         element.dispatchEvent(clickEvent);  
		 // 显示视觉反馈  
		const feedback = document.createElement('div');  
		feedback.style.position = 'absolute';  
		feedback.style.width = '10px';  
		feedback.style.height = '10px';  
		feedback.style.backgroundColor = 'green';  
		feedback.style.borderRadius = '50%';  
		feedback.style.left = `${x - 5}px`; // 减去半径以居中显示圆点  
		feedback.style.top = `${y - 5}px`; // 减去半径以居中显示圆点  
		feedback.style.pointerEvents = 'none'; // 防止反馈元素阻挡点击事件  
		element.appendChild(feedback); // 将反馈元素添加到目标元素中 
     }, 1000); // 等待100毫秒，模拟用户将鼠标移动到位置后稍作停顿再点击  
  
    // 在控制台输出点击的坐标  
    console.log(`Simulated move and click at (${x}, ${y})`);  
}