我见过并使用过允许您在元素上创建单击事件的代码，但这些单击事件似乎是在元素的 0,0 坐标处创建的。我有一个 Canvas 元素，我需要在其中心附近创建一个单击事件。

如何在元素中心附近创建点击事件？

例如，我想点击该元素 20px,30px 处的位置:

<canvas style="width: 50px; height: 50px;"> 

我尝试设置鼠标事件属性 clientX 和 clientY，但是没有在应有的位置注册单击，所以我猜这些属性没有按照我想象的那样执行。

请您参考如下方法:

只需查看 MDN 上的 MouseEvent 文档，您就可以尝试以下操作。我没有找到选择元素本身像素的方法，但您可以使用 Canvas 元素上的 getBoundingClientRect 方法的结果来计算窗口上所需的位置。

var canvasBCR = canvas.getBoundingClientRect(); 
canvas.dispatchEvent(new MouseEvent("click", {clientX: canvasBCR.left + 20, clientY: canvasBCR.top + 30}));