前言

怎么说呢，竟然不知道有这个玩意。当发现可以通过JS来主动触发事件后，这直接打开了我的视野。原本一个不知道如何下手去解决的问题，突然就变得小菜一碟。

实现

有几种方式，这里都进行介绍一下。

eleme.click()

这是最简单的一种方式，获取到响应的dom元素，然后执行click事件即可，如下图：

Document.createEvent()

createEvent 使用的许多方法，如 initCustomEvent，都被废弃了。请使用 event constructors 来替代。

因为有很多方法已经弃用了，这里就简单介绍一下，具体用法可以查看：Document.createEvent()

语法

var event = document.createEvent(type);

event 是返回的事件对象type是事件类型

我们还是以鼠标事件为例，毕竟鼠标事件是最常用的。

onMounted(() => {// 创建通用事件const event = document.createEvent('Event');// 初始化事件，参数1：事件名，参数2：是否可以冒泡，参数3：是否可以被阻止event.initEvent('click', true, false);// 监听事件// elem.addEventListener('click', () => { });// 每个1000触发一次setInterval(() => {document.getElementById('btn')?.dispatchEvent(event);}, 1000);});

使用Event构造函数自定义事件

onMounted(() => {// 创建事件，也可以像vue那样自定义事件const event = new Event('click');setInterval(() => {document.getElementById('btn')?.dispatchEvent(event);}, 2000);});