JS如何模拟鼠标点击X,Y坐标

JavaScript014

JS如何模拟鼠标点击X,Y坐标,第1张

现在我有个窗口坐标X,Y. 如何利用JS点击该坐标?

https://developer.mozilla.org/zh-CN/docs/Web/API/Document/createEvent

遍历dom元素,记录每个元素的坐标,找到离(x,y)最近的且z-index最大一个元素,模拟这个dom元素的点击

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/initMouseEvent

其中,

initMouseEvent 方法用于初始化通过 DocumentEvent 接口创建的 MouseEvent 的值。此方法只能在通过dispatchEvent 方法指派 MouseEvent 之前调用,尽管在该阶段可以多次调用它(如有必要)。如果被多次调用,则最后一次调用优先。

参数:

document.createEvent用于创建事件,在DOM Level 2 的事件中就有HTMLEvents,MouseEvents,UIEvents事件类型。DOM Level 3增加很多事件类型,个人觉得其中最有用的是CustomEvent自定义事件。

有效的事件类型列表:

http://www.w3school.com.cn/xmldom/met_document_createevent.asp#eventType

为DOM元素创建自定义事件的步骤为:

一、创建事件:var ev = document.createEvent('CustomEvent')

二、初始化事件:ev.initCustomEvent('自定义事件名称', false(是否允许冒泡), false(是否允许中断),args)

三、为DOM添加事件监听:element.addEventListener('自定义事件名称',fn,false)

四、分发(触发)自定义事件:element.dispatchEvent(ev)

首先你要先搞清你所说的坐标变化不大是相对窗口,屏幕,还是文档的,他们的坐标系是不同的。不知你想要找的是哪一个。

1相对窗口,当然是以浏览器窗口为主了,即浏览器中可见部分(即包含文档部分)的左上角为坐标原点。这是用clientX和clientY获取的。

2相对屏幕,当然是以你的显示器为主了,显示器的左上角为原点,用screenX和screenY可以获取到

3相对文档的,即以文档BODY所显示的左上角为原点,例如当一个DIV的position="absolute"时设left="100px" top="100px"那么无论你如何变换浏览器,虽然它显示的位置在变但他在文档中的位置是不变的。一般用document.body.scrollLeft+event.clientX和document.body.scrollTop+event.clientY来获取

而offsetX解释说是事件产生的位置和鼠标位置的偏移量,没太理解,我也是初学。

而你说改变分辨率坐标改变,这是必然的。因为在不同的分辨率下网页的显示样式不同,这不是坐标改变的主要原因,主要还是因为度量的改变,如:无论屏幕的分辨率怎么改屏幕大小是不变的,但它代表的显示逻辑长度改变了,如1024×768和800×600,同样宽度的屏幕被当成1024个长度单位来用和当成800个长度单位来用当然会不同,当你点击屏幕的中央时前者返回的是1024/2而后者返回的是800/2.所以坐标值会改变。就像你用米尺量是1米,用寸尺量是3寸,一个是1,一个是3一样的道理。