博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Chrome开发者工具中Elements(元素)断点的用途
阅读量:6066 次
发布时间:2019-06-20

本文共 528 字,大约阅读时间需要 1 分钟。

hot3.png

SAP Engagement Center UI的这个按钮会每秒钟刷新一次,显示页面已经打开了多长时间。

需求:需要找到哪行JavaScript代码不断刷新的按钮文字。

按照经验判断,这个文字肯定是一个JavaScript function通过setTimeout每隔一秒执行的。如何快速找到这个function以及setTimeout的调用位置呢?

1. 利用Chrome开发者工具的Elements标签页功能,找到该按钮HTML源代码对应的标签。

2. 右键单击该标签,选择Break on->subtree modification:

一秒钟之后,断点会自动触发,停留在该元素的innerHTML发生变化的代码位置。从代码478我们得知,UI上按钮的文字能够刷新,是因为其dom元素的innerHTML属性被修改的缘故。

从调用栈也能迅速找到setTimeout的调用位置和调用间隔(1秒)

更多Jerry的Chrome开发者工具使用心得,请参考Jerry的公众号文章: 要获取更多Jerry的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

转载于:https://my.oschina.net/u/3771578/blog/1811336

你可能感兴趣的文章
修改字符集
查看>>
HackTheGame 攻略 - 第四关
查看>>
js删除数组元素
查看>>
带空格文件名的处理(find xargs grep ..etc)
查看>>
华为Access、Hybrid和Trunk的区别和设置
查看>>
centos使用docker下安装mysql并配置、nginx
查看>>
关于HTML5的理解
查看>>
需要学的东西
查看>>
Internet Message Access Protocol --- IMAP协议
查看>>
Linux 获取文件夹下的所有文件
查看>>
对 Sea.js 进行配置(一) seajs.config
查看>>
dom4j解析xml文件
查看>>
第六周
查看>>
斯坦福大学公开课机器学习:梯度下降运算的学习率a(gradient descent in practice 2:learning rate alpha)...
查看>>
解释一下 P/NP/NP-Complete/NP-Hard 等问题
查看>>
javafx for android or ios ?
查看>>
微软职位内部推荐-Senior Software Engineer II-Sharepoint
查看>>
sql 字符串操作
查看>>
【转】Android布局优化之ViewStub
查看>>
网络安全管理技术作业-SNMP实验报告
查看>>