1回答

• 

  慕粉3197089

  2016-07-12 15:15:13

  function f1(){
          //只是为了改变点击后的样式，重复代码很多，造成重复劳动，后期可调整成循环
          document.getElementById("first").style.display="block";
          document.getElementById("second").style.display="none";
          document.getElementById("third").style.display="none";
          document.getElementById("tag1").style.borderTopColor="red";
          document.getElementById("tag1").style.borderTopWidth="2px";
          document.getElementById("tag1").style.borderBottomWidth="2px";
  
          document.getElementById("tag2").style.borderTopColor="blue";
          document.getElementById("tag2").style.borderTopWidth="1px";
          document.getElementById("tag2").style.borderBottomWidth="1px";
  
          document.getElementById("tag3").style.borderTopColor="blue";
          document.getElementById("tag3").style.borderTopWidth="1px";
          document.getElementById("tag3").style.borderBottomWidth="1px";
      }
      function f2(){
          document.getElementById("first").style.display="none";
          document.getElementById("second").style.display="block";
          document.getElementById("third").style.display="none";
          document.getElementById("tag1").style.borderTopColor="blue";
          document.getElementById("tag1").style.borderTopWidth="1px";
          document.getElementById("tag1").style.borderBottomWidth="1px";
  
  
          document.getElementById("tag2").style.borderTopColor="red";
          document.getElementById("tag2").style.borderTopWidth="2px";
          document.getElementById("tag2").style.borderBottomWidth="2px";
  
          document.getElementById("tag3").style.borderTopColor="blue";
          document.getElementById("tag3").style.borderTopWidth="1px";
          document.getElementById("tag3").style.borderBottomWidth="1px";
  
      }
      function f3(){
          document.getElementById("first").style.display="none";
          document.getElementById("second").style.display="none";
          document.getElementById("third").style.display="block";
          document.getElementById("tag1").style.borderTopColor="blue";
          document.getElementById("tag1").style.borderTopWidth="1px";
          document.getElementById("tag1").style.borderBottomWidth="1px";
  
          document.getElementById("tag2").style.borderTopColor="blue";
          document.getElementById("tag2").style.borderTopWidth="1px";
          document.getElementById("tag2").style.borderBottomWidth="1px";
  
          document.getElementById("tag3").style.borderTopColor="red";
          document.getElementById("tag3").style.borderTopWidth="2px";
          document.getElementById("tag3").style.borderBottomWidth="2px";
      }

  
  

  这个比较通俗，你可以换成循环，代码就比较简单
  

  0 0