I am maintaining a web site that does some magic behavior (well, it adds a few characters that are not in the html) to elements tagged:
class="popupover-host"
I can't find this referenced in the css, and so far don't see it referenced in any .js
In the browser, it is pre rendered, and examining the element shows me the fully processed text (e.g. the text that is in the source html PLUS the added characters).
I feel like I need to watch the browser process the html, but have not done this before.
The question boils down to this (I think):
Static html + css can be figured out "by hand" by mapping the "class" tags in the html to the relevant css. We know the browser bolts the two together at render time. Add js to the picture, and it gets... harder to figure out how the final html was created.
And with nested css... it is also hard to figure out.
Question:
-
So, how do I watch the browser bolt it all together?
-
For example, if I know the "class" that is being modified, how can I see where the modifications come from? (css and/or js)
-
Is there a way to either: a) Have the browser tell me the things that have modified the contents of this class, or b) run a "debugger" with a watch on the class in question, to see what the browser applies to the contents of that class?
Comments
Post a Comment