Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Recover default style when modified with JavaScript

Tags:

javascript

css

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?

like image 208
Michel Neeser Avatar asked Jan 18 '11 19:01

Michel Neeser


People also ask

How do I reset CSS to default?

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).

Can default property value be restored through CSS?

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.

How can the style of an element be changed in JavaScript?

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!">

Can JavaScript change the style of HTML?

The HTML DOM allows JavaScript to change the style of HTML elements.


1 Answers

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.

like image 192
Pointy Avatar answered Oct 23 '22 16:10

Pointy