LeonidasFett LeonidasFett - 2 months ago 7
CSS Question

Determine which JS function applied a certain style with Chrome

Is there a way I can determine which JQuery function applied a certain style with Chrome Dev Tools?

For example:

enter image description here

I have this markup in the Elements tab of Chrome dev tools:

As you can see, it has an inline style of

display:none;
Is there a way to determine which function applied this style?

Answer

You can make use of Attributes modifications

Attributes modifications: Triggered when an attribute is added or removed on the currently selected node, or when an attribute value changes.

To break on all inline style changes using the Elements panel context menu's Break on -> Attributes modifications.

See: https://developers.google.com/web/tools/chrome-devtools/debug/breakpoints/add-breakpoints?hl=en - Set a breakpoint on DOM change

Comments