Home > Web Front-end > JS Tutorial > body text

Share an example code about JS

零下一度
Release: 2017-06-26 15:16:42
Original
992 people have browsed it





无标题文档

<script><br>window.onload=function(){<br>    var td1=document.getElementById("td");<br>    var dv0=document.getElementById("dva");<br>    var dv1=document.getElementById("dvv");<br>    var dv2=document.getElementById("dve");<br>    var color1=document.getElementById("c1");<br>    var color2=document.getElementById("c2");<br>    var color3=document.getElementById("c3");<br>    var width1=document.getElementById("w1");<br>    var width2=document.getElementById("w2");<br>    var width3=document.getElementById("w3");<br>    var height1=document.getElementById("h1");<br>    var height2=document.getElementById("h2");<br>    var height3=document.getElementById("h3");<br>    var re=document.getElementById("recover");<br>    var su=document.getElementById("sure");<br><br>    td1.onclick=function(){<br>        dv2.style.display='block';<br>        dv0.style.background='#999999';<br>        }<br><br>    color1.onclick=function(){<br>        dv1.style.background='#F00';<br>        }<br>    color1.onmouseover=function(){<br>        color1.style.background='#F00';<br>        }<br>    color1.onmouseout=function(){<br>        color1.style.background='#99CC66';<br>        }<br><br>    color2.onclick=function(){<br>        dv1.style.background='#FF0';<br>        }<br>    color2.onmouseover=function(){<br>        color2.style.background='#FF0';<br>        }<br>    color2.onmouseout=function(){<br>        color2.style.background='#CCCC00';<br>        }<br><br>    color3.onclick=function(){<br>        dv1.style.background='#00F';<br>        }<br>    color3.onmouseover=function(){<br>        color3.style.background='#00F';<br>        }<br>    color3.onmouseout=function(){<br>        color3.style.background='#3399CC';<br>        }<br><br>    width1.onclick=function(){<br>        dv1.style.width='200px';<br>        }<br>    width1.onmouseover=function(){<br>        width1.style.background='#F90';<br>        }<br>    width1.onmouseout=function(){<br>        width1.style.background='#CCC';<br>        }<br><br>    width2.onclick=function(){<br>        dv1.style.width='300px';<br>        }<br>    width2.onmouseover=function(){<br>        width2.style.background='#F90';<br>        }<br>    width2.onmouseout=function(){<br>        width2.style.background='#CCC';<br>        }<br><br>    width3.onclick=function(){<br>        dv1.style.width='400px';<br>        }<br>    width3.onmouseover=function(){<br>        width3.style.background='#F90';<br>        }<br>    width3.onmouseout=function(){<br>        width3.style.background='#CCC';<br>        }<br><br>    height1.onclick=function(){<br>        dv1.style.height='200px';<br>        }<br>    height1.onmouseover=function(){<br>        height1.style.background='#F90';<br>        }<br>    height1.onmouseout=function(){<br>        height1.style.background='#CCC';<br>        }<br><br>    height2.onclick=function(){<br>        dv1.style.height='300px';<br>        }<br>    height2.onmouseover=function(){<br>        height2.style.background='#F90';<br>        }<br>    height2.onmouseout=function(){<br>        height2.style.background='#CCC';<br>        }<br><br>    height3.onclick=function(){<br>        dv1.style.height='400px';<br>        }<br>    height3.onmouseover=function(){<br>        height3.style.background='#F90';<br>        }<br>    height3.onmouseout=function(){<br>        height3.style.background='#CCC';<br>        }<br><br>    re.onclick=function(){<br>        dv1.style.width='150px';<br>        dv1.style.height='150px';<br>        dv1.style.background='none';<br>        }<br><br>    su.onclick=function(){<br>        dv2.style.display='none';<br>        dv0.style.background='none';<br>        }<br>    }<br></script>



   
       
       
       
       
   

       请为下面的DIV设置样式:
       

       点击设置
       

   

   

   

   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
请选择背景颜色:
请选择宽(px):200300400
请选择高(px):200300400

     
   
   
   
   
   
恢复确定

   



The above is the detailed content of Share an example code about JS. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template