鼠标 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
        .div1{
            width: 200px;
            height: 200px;
            background: red;
            margin: 0 auto;
            transition: all 2s; 
        }
    </style>
    </head>
    
    <body><div class="div1"></div>
    </body>
    
    
<script type="text/javascript">
    var div1=document.querySelector('.div1')
    
    div1.onmouseenter=function(e){
        div1.style.background="#333333"
        div1.style.color="royalblue"
        div1.innerHTML='<span>这是个小猪</span>'
    
    }
    div1.onmouseleave=function(e){
        div1.style.background="#87CEEB"
        div1.style.color="royalblue"
        div1.innerHTML='<span>这是个小猪</span>'
        
    }

</script>
</html>

 

posted @ 2019-03-18 21:42  就这样子吧  阅读(91)  评论(0)    收藏  举报