In a JS function, I've set the background color of a text field like this:
document.getElementsByName(formId)[0].title.style.backgroundColor = "#7FB75E";
In another function, I want to reset the background color to the default value defined in my style sheet. How can I do this?
Use the initial keyword to set a property to its initial value. Use the inherit keyword to make an element's property the same as its parent. Use the revert keyword to reset a property to the value established by the user-agent stylesheet (or by user styles, if any exist).
In short, there's no easy way to restore to default values to whatever a browser uses . The closest option is to use the 'initial' property value, which will restore it to the default CSS values, rather than the browser's default styles.
In order to change a style property of an element, change the value associated with the property under the "style" argument of the element. Let's continue with our button example from the last section: <input type="button" id="myButton" value="I'm a button!">
The HTML DOM allows JavaScript to change the style of HTML elements.
Just set the value on the "style" object to the empty string.
document.getElementsByName(formId)[0].title.style.backgroundColor = "";
edit — note that if your element had an inline style, you'd have to explicitly save that somewhere or else you won't be able to get it back.
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