所以例如一个事件可能存在于一个这样的结构上。
< div> < ul> < li>< span>< img />< / span>< / li> < / ul> < / div>现在我不知道事件是否绑定到img,span,li,ul或div本身。 Chrome具有事件侦听器区域,但我觉得它并不总是包含事件。你们做的任何事情都可以让你快速找到这个事件并放弃一个断点。
解决方案是的! / p>
找到要重新加载的元素,右键单击从上下文菜单中选择检查,然后右键单击元素的HTML(在底部的firebugish窗格),在上下文菜单中有以下选项:
- 修改子树修改
- 断开属性修改
- 断开节点删除
chrome中的新开发者功能: http:/ /elijahmanor/7-chrome-tips-developers-designers-may-not-know/
I don't have a specific use case here, but occasionally I have been either helping out someone on SO or seen a cool javascript effect on a website and been curious about the code that drives it. However, the event that drives the code may not be immediately obvious. If I can't find the event handler then it can be really hard to find the js responsible for the effects I am interested in. Is there a quick way in the debugger to identify the events attached to an element and to drop a break point in when it fires?
So for example an event may exist on a structure something like so
<div> <ul> <li><span><img /></span></li> </ul> </div>Now I don't know if the event is bound to the img, span, li, ul or div itself. Chrome has the Event Listeners area, but I feel like it doesn't always contain events. Anything you guys do that allows you to quickly find the event and drop a break point into it?
解决方案yes there is!
find the element that is being reloaded and right click, choose inspect from context menu, then right click the html of the element (in the bottom firebugish pane), in the context menu there are options to:
- break on subtree modifications
- break on attributes modifications
- break on node removal
Article on awesome new dev features in chrome: elijahmanor/7-chrome-tips-developers-designers-may-not-know/
更多推荐
使用Chrome JavaScript调试器跟踪事件
发布评论