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

连续点击”添加样式“能让其样式在 .one和.two之间变换。

连续点击”添加样式“能让其样式在 .one和.two之间变换。连续点击，让两个样式交换出现。求大神指导。。。

可乐盖

2016-07-14

源自：JavaScript入门篇 3-6

关注问题我要回答

1342

操作

收起

2 回答

憨痕回答被采纳 +3 积分
2016-07-14

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
body{font-size:12px;}
.one{color:red;}
.two{color:blue;}

</style>
</head>
<body>
  <h2 id="con" class="one">JavaScript课程</H2>
  <input type="button" value="改变字体颜色" id="obtn" />
  
  <script type="text/javascript">
  var oCon = document.getElementById("con");
  var oBtn = document.getElementById("obtn");
  
  oBtn.onclick = function(){
    if (oCon.className == "one") 
    {
      oCon.className = "two";
    }
    else
    {
      oCon.className = "one"
    }
  }

  </script>
</body>
</html>