js简单函数（动态交互）

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
   </head>
   <style type="text/css">
       body{font-size: 12px;}
       #text{ 600px;height: 400px;border:1px solid #333333 ;padding: 5px;}
       p{line-height: 18px;text-indent: 2em;}
   </style>
   <body>
       <h2 id="con">js交互</h2>
       <form>
           <input type="button" value="改变颜色" onclick="changecolor()"/>
           <input type="button" value="改变宽高" onclick="changewh()"/>
           <input type="button" value="隐藏内容" onclick="changehide()"/>
           <input type="button" value="显示内容" onclick="changeshow()"/>
           <input type="button" value="取消设置" onclick="cancel()"/>
       </form>

   </body>
   <script type="text/javascript">
       //changecolor
       function changecolor(){
           var a1=document.getElementById("con");
           a1.style.color="#FF0000";
       }
       function changewh(){
           var a1=document.getElementById("txt");
           a1.style.width="300px";
           a1.style.height="300px";
       }
       function changehide(){
           var a1=document.getElementById("con");
           a1.style.display="none";
       }
       function changeshow(){
           var a1=document.getElementById("con");
           a1.style.display="block";
       }
       function cancel(){
           var c=confirm("取消所有设置？");
           if(c){
               document.getElementById("txt").style.cssText="null";
           }

       }
   </script>
</html>