Menu
I have an element that's getting styles applied via JavaScript. I'm not sure exactly where; is there a way to check Firebug to show where the "element.style" is actually coming from?
722
In Chrome, if you right click on an element and "inspect," then view the styles in the "Computed" tab then you should see what styles are affecting the element.
The HTML DOM allows JavaScript to change the style of HTML elements.
style. The style read-only property returns the inline style of an element in the form of a CSSStyleDeclaration object that contains a list of all styles properties for that element with values assigned for the attributes that are defined in the element's inline style attribute.
To check if an element's style contains a specific CSS property, use the style object on the element to access the property and check if it's value is set, e.g. if (element. style. backgroundColor) {} . If the element's style does not contain the property, an empty string is returned.
If you're sure it's being set on the inline style and not as a consequence of a stylesheet rule, you can detect changes using the non-standard Mozilla watch() method:
document.body.style.watch('color', function(name, v0, v1) { alert(name+': '+v0+'->'+v1); }); document.body.style.color= 'red'; You can put debugger; in the watcher function and look up the call stack in Firebug to see where the change was triggered.
115
On request from this question:
If you have firefox you can check the "Break on Attribute Change" option in the HTML tab. Just right click the target element and the menu will pop up. After that, resize the window and it will break in the script line where the attribute is changed.
20
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
