改了样式如何再恢复样式呢?-慕课网

首页课程实战体系课手记专栏慕课教程

改了样式如何再恢复样式呢?

来源：3-6 控制类名（className 属性）

qq_慕尼黑9285125

2019-10-23 13:04

<!DOCTYPE HTML>

<html>

<head>

<title>className属性</title>

<style>

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;

}

</style>

</head>

<body>

<p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>

<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>

function add(){

var p1 = document.getElementById("p1");

p1.className="one";

}

function modify(){

var p2 = document.getElementById("p2");

p2.className="two";

}

function back1(){

var p2 = document.getElementById("p3");

p3.className="two";

}

function back2(){

var p4 = document.getElementById("p2")

p4.className="one";

}

</script>

</body>

</html>

写回答关注

2回答

慕九州5249392

2019-11-29 15:54:44

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style>
    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;
   }
   </style>
</head>
<body>
    <p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="添加样式" onclick="add()" id="p3"/>
   <p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="更改外观" onclick="modify()"/>

   <script type="text/javascript">
       function add(){
          var p1 = document.getElementById("p1");
          var p3= document.getElementById("p3")
          if(p1.className=="")
          {p1.className="one";p3.value="恢复"}
          else {p1.className="";p3.value="添加元素"}
       }
       function modify(){
          var p2 = document.getElementById("p2");
          p2.className="two"
       }
   </script>
</body>
</html>
可以参考下

0 0
ural

2019-10-23 22:19:43

加个按钮，object.className="none";

0 0

JavaScript入门篇

JavaScript做为一名Web工程师的必备技术，本教程让您快速入门

739816 学习 · 9566 问题

查看课程

相似问题

removeattribute恢复样式？

回答 1

恢复样式代码

回答 2

恢复成原来的样式外观

回答 3

removeAttribute是清除所有样式还是恢复原来的样式

回答 4

想恢复样式，但好像不太行

回答 4

打开慕课网App查看更多内容