有没有比较便捷的方法，可以知道前端触发了什么 funcion？比如在一个网页中，我点击某个未知功能的按钮，触发了一连串 function，如何快捷地知道这些的 function 名字？
good1uck · Jan 16, 2020 · 2511 viewsThis topic created in 2489 days ago, the information mentioned may be changed or developed.
Supplement 1 · Jan 16, 2020
不仅局限于按钮触发的 function
Supplement 2 · Jan 16, 2020
因为最近被交接了一个项目，前任注释和文档很少.
 |
1
浏览器控制台输入：
$("这里是元素选择器")[0].onclick 例如帖子的顶和踩按钮： $("#topic_638293_votes > a:nth-child(1)")[0].onclick 返回内容： function onclick(event) { upVoteTopic(638293); } |
2 |
2
@KasuganoSoras 谢谢，如果不仅局限于按钮触发的 function 呢？
|
 |
3
调试工具有个事件选项，选上就行，每个都调用，比较烦就是了
|
 |
4
试一下给这个按钮加断点。触发断点后，然后在 Chrome 调试工具的 Sources 面板的右侧有个 Call Stack,可以看相关的调用栈信息。
|
 |
5
@KasuganoSoras 如果代码是用 addEventListener 添加的事件处理器，onclick 可能是 null 哦，简单点可以在当前页面控制台测试以下代码：
``` document.body.onclick // return null document.body.addEventListener('click', function(){}) // 添加了点击事件 document.body.onclick // return null 虽然添加了点击事件，但是 onclick 属性还是 null ``` |
 |
6
以 chrome 浏览器的 devtools 为例，打开 devtools，选择 elements 选项，找到你的元素，不限定于“按钮”，任何元素都成，左侧面板中有个 event listeners,里面包含了该对应元素上的所有事件，每个事件对应的方法都可以展开看详细内容
|
|
7
 |
|
daguaochengtangJan 16, 2020
8
接上图，保存为变量后 chrome 会把这个函数赋给一个变量，比如 temp1,你直接 temp1()，和点击感谢是一样的
``` ƒ onclick(event) { if (confirm('你确定要向本主题创建者发送谢意？')) { thankTopic(638293, '14539'); } } ``` |
 |
vanishcodeJan 20, 2020
9
|
|
vanishcodeJan 20, 2020
10
getEventListeners()这个方法是 native 的 cli 函数，代码里用不了（ puppeteer 可能能用），上文博客中的$._data 是 jq 的方法，具体你可以看它怎么实现的，或者使用 puppeteer 或者其他 headless 注入一个 jq。。
|
Select Language