                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript入门篇

如何实现将应用的属性再返回到默认样式？

我更改了类属性后，怎么返回原来的属性？类似于撤销的功能？

慕容8128746

2017-07-21

源自：JavaScript入门篇 3-6

关注问题我要回答

1107

操作

收起

3 回答

npc9527 回答被采纳 +3 积分
2017-07-21

var p1 = document.getElementById("p1");
p1.classList.remove("one");

这样可以移除你添加的类

0 回复有任何疑惑可以回复我~

收起回答

慕容8128746 提问者

但你这样删除更改的类后所剩下的属性是不是更改钱的属性呢？

2017-07-21 回复有任何疑惑可以回复我~

慕容8128746 提问者

比如我最开始的属性为属性1，更改后的属性为属性2，我使用删除属性后是恢复为属性1还是变成初始的属性了？

2017-07-21 回复有任何疑惑可以回复我~

npc9527 回复慕容8128746 提问者

比如这个p1一开始是没有样式的，你添加类名为one的样式以后就改变了它的样式，把one移除之后就是原来的样子了

2017-07-21 回复有任何疑惑可以回复我~

查看5条回复

慕容8128746 提问者
2017-07-21

body{ font-size:16px;}
    .one{
		border:1px solid #eee;
		width:230px;
		height:50px;
		background:#ccc;
		color:red;
    }
	.two{
		border:1px solid #ccc;
		width:230px;
		height:50px;
		background:#9CF;
		color:blue;
	}
	.Pnone{
	    font-size:16px;
	}
	</style>
</head>
<body>
    <p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="添加样式" onclick="add()"/>
    <input type="button" value="返回" onclick="none1()"/>
	<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="更改外观" onclick="modify()"/>
    <input type="button" value="返回" onclick="none2()"/>

	<script type="text/javascript">
	   function add(){
	      var p1 = document.getElementById("p1");
	      
	      p1.className="one";
	   }
	   function modify(){
	      var p2 = document.getElementById("p2");
	      p2.className="two";
	   }
	   function none1(){
	       var p1= document.getElementById("p1");
	       p1.className="Pnone";
	      }
	       function none2(){
	       var p2= document.getElementById("p2");
	       p2.className="Pnone";
	       }
	</script>
</body>

看下我下面的代码，也可以实现，但感觉太啰嗦，是否能优化一下？

0 回复有任何疑惑可以回复我~

收起回答