How to Remove CSS Properties Dynamically with JavaScript?

Removing CSS Properties Dynamically with JavaScript

Removing a CSS Property Using removeProperty()

JavaScript provides the removeProperty() method to remove a specific CSS property from an element. This method takes the property name as its argument and removes it from the element's style.

<code class="javascript">// Select the element
const element = document.getElementById('myElement');

// Remove the "zoom" property
element.style.removeProperty('zoom');</code>

Setting the Property to Its Default Value

Alternatively, you can remove a CSS property by setting it to its default value. For example, the default value for the "zoom" property is "1".

<code class="javascript">// Select the element
const element = document.getElementById('myElement');

// Set the "zoom" property to its default value
element.style.zoom = "";</code>

In this case, the browser will refer to the stylesheets (through link and style tags) to apply the appropriate zoom level, effectively removing the local zoom property set on the element.

The above is the detailed content of How to Remove CSS Properties Dynamically with JavaScript?. For more information, please follow other related articles on the PHP Chinese website!