js 查看元素已绑定事件

js 查看元素已绑定事件
以 element Tooltip 文字提示为例：

在控制台中执行：

getEventListeners(document.getElementsByClassName("el-tooltip")[0])

猜测是 mouseenter 或者 mouseover 触发的事件导致的文字展示，发现绑定的事件中有 mouseenter
找到调用的 mouseenter 目标函数，点击查看：

把 js 代码拷贝到格式化工具中，格式化后，查找方法 handleShowPopper：
（我用的是在线格式化工具：http://tool.chinaz.com/Tools/jsformat.aspx ，格式化后把代码拷贝到本地记事本中）

发现这个方法只是修改了参数 showPopper

再看元素 vue 中相关的方法：

document.getElementsByClassName("el-tooltip")[0].__vue__

发现有个参数 showPopper
修改参数值：

document.getElementsByClassName("el-tooltip")[0].__vue__.showPopper=true

document.getElementsByClassName("el-tooltip")[0].__vue__.showPopper=false

可见控制 showPopper 的值就可以控制tooltip的展示。

其实直接看文档，给元素绑定 value 值也是可以实现的。对于没有文档，想要查找元素被绑定的事件以及具体的方法，或者要通过控制台控制元素，就要通过上面的方法啦。