方法1:使用CSS removeProperty:该CSSStyleDeclaration.removeProperty()方法被用来从一个元件的样式删除一个属性。通过遍历styleSheets数组并选择cssRule,可以选择元素的样式。然后可以使用要删除的属性指定removeProperty方法。句法:
element.removeProperty('property')
实例1:
<html>
<head>
<title>
How to remove CSS property using JavaScript?
title>
<style>
.elem {
color: green;
font-size: 3rem;
text-decoration: underline;
}
style>
head>
<body>
<h1 style="color: green">
GeeksForGeeks
h1>
<b>
How to remove CSS property using JavaScript?
b>
<div class="elem">Hello World!div>
<p>
Click on the button below to remove
the text decoration of the element
p>
<button onclick="removeProperty()">
Remove text-decoration property
button>
<script>
function removeProperty() {
element =
document.styleSheets[0].cssRules[0].style;
element.removeProperty('text-decoration');
}
script>
body>
html>
输出:在单击按钮之前:单击按钮后:方法2:使用setProperty方法:该CSSStyleDeclaration.setProperty()方法可用于设置的样式的所需的属性。选择必须删除其属性的元素,并将此属性应用于其style属性。将此属性设置为“ initial”可将属性重置为其初始值,从而消除该属性的任何影响。句法:element.style.setProperty('color','initial')
例如:
<html>
<head>
<title>
How to remove CSS property using JavaScript?
title>
<style>
.elem {
color: green;
font-size: 3rem;
text-decoration: underline;
}
style>
head>
<body>
<h1 style="color: green">
GeeksForGeeks
h1>
<b>
How to remove CSS property using JavaScript?
b>
<div class="elem">Hello World!div>
<p>
Click on the button below to remove the text
color of the element
p>
<button onclick="removeProperty()">
Remove color property
button>
<script>
function removeProperty() {
element = document.querySelector('.elem');
element.style.setProperty('color', 'initial');
}
script>
body>
html>
输出:在单击按钮之前:
免责申明:本站所有内容均来自网络,我们对文中观点保持中立,对所包含内容的准确性,可靠性或者完整性不提供任何明示或暗示的保证,请仅作参考。若有侵权,请联系删除。