问答详情
源自:9-1 认识DOM

本次交作业, 我觉得这样写不错, 可以看看。

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>style样式</title>

</head>

<style type="text/css">

    .one{

        border: 2px solid #eee;

        width: 230px;

        height: 50px;

        background: #CCC;

        color:brown;

    }

</style>

<script type="text/javascript">

   function fun1(){

    var i = document.getElementById("con");

        i.className = "one";

   }

   function fun2(){

       var i = document.getElementById("con");

        i.style.display="block";

   }

   function fun3(){

       var i = document.getElementById("con");

       i.style.display="none";

   }

   function fun4(){

       var i = document.getElementById("con");

       i.className = "";

   }

  </script>

<body>

  <h2 id="con">I love JavaScript</H2>

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

  <form>

      <input type="button" value="换色" onclick="fun1()">

      <input type="button" value="还原" onclick="fun4()">

      <input type="button" value="显示" onclick="fun2()">

      <input type="button" value="隐藏" onclick="fun3()">

  </form>

  

  

</body>

</html>


提问者:慕娘6283028 2020-08-13 19:24

个回答

  • 阳火锅
    2020-08-14 11:40:28
    已采纳

    http://img1.mukewang.com/5f3607a00001cf3603600272.jpg封装一下

  • 慕娘6283028
    2020-08-14 13:41:09

    这个方法不错, 学习了