作者aoksc (重出江湖)
看板Ajax
标题[问题] 如何找出执行了哪些function?
时间Fri Sep 21 00:29:25 2018
想请教各位
如果你接手到js非常乱
一个js档都是几百行起跳
那要找到某个tag触发了哪些事件各位都是怎麽找的?
因为小弟我在找的时候大概不外乎就是用id或class去整个专案搜寻
去看看可能哪里有call到
但这种方式对於写法很奇杷或是重复名称太多code
往往连从哪里开始都无从查起或是要查的非常久
再不然就是要下一大堆debugger看那一个地方他停住了
想请问各位在trace javascript code的时候
是不是有什麽技巧可以分享
或是有什麽资料可以推荐给小弟呢?
感谢
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 118.233.159.254
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Ajax/M.1537460969.A.1FE.html
1F：→ InfinityGate: dev tools 直接看绑了哪些 Event Listener 09/21 00:59
2F：→ jhnny97: 你可以试试在第一支JS设一个breakpoint，然後一步步跳 09/22 20:06
感谢解答
那像我用Chrome的dev tools
在event的部份如下图
https://imgur.com/a/x92qrmG
现在假设我是要图片zoom in zoom out是在哪里用js写的
我推测是focus event触发
测试也应该没错
我是直接在jquery原始档下中断点
但它并不是用by id或by class的方式去select
如果用img、或是.focus这类的关键字去搜寻档案又会找出一堆
请问还有什麽有效率的方式或功能可以方便找出定义这触发事件的源头呢?
谢谢
※ 编辑: aoksc (118.233.159.254), 09/23/2018 22:54:02
3F：推 InfinityGate: console.trace() 09/23 23:05
所以console.trace()也是要去埋在可能的code里面
然後看看有无出现相关讯息这样?
※ 编辑: aoksc (118.233.159.254), 09/23/2018 23:56:08
4F：→ InfinityGate: 完全没有任何线索可以塞trace吗? 09/24 01:53
5F：→ InfinityGate: jquery可以试试用visual event找 09/24 01:54
6F：推 othree: DevTool Performance 录一下你想查的事件 09/24 23:38
7F：推 rexyeah: 你可以对HTML ele下中断点看哪个事件修改节点或属性 09/28 10:35
8F：推 visa9527: 现在 Firefox 的 console 不是已经可以看经历过的所有 10/02 15:38
9F：→ visa9527: function了? 不过若有用递回的话你会看得很花 10/02 15:38