随机基础上加按钮

原创 2019-01-16 13:25:36 194
摘要:<!DOCTYPE html> <html> <head>     <meta charset="UTF-8">     <meta name="viewport" content=&q
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="/jQuery/jQuery-3.3.1.js"></script>
     <style>
         a{border-radius: 50px; float: left;display: block;height: 50px;width: 50px;margin-top: 50px;margin-left: 50px;line-height: 50px;text-align: center;color: aqua;}
     </style>
     <script>
         function aa(tag){ 
             var len=document.getElementsByTagName(tag).length
             for(i=0;i<len;i++){
                 document.getElementsByTagName(tag)[i].style.backgroundColor='rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')'
             }
         }
         function h(c){ 
             var l=document.getElementsByTagName(c).length
             for(i=0;i<l;i++){
                 document.getElementsByTagName(c)[i].innerHTML=Math.floor(Math.random()*1000)
             }
         }
         $(function(){
             aa('a')
            $('.bt1').click(function(){
                aa('a');
                h('a')
            })
            $('a').mouseover(function(){
                $bg=$(this).css('backgroundColor')
                $(this).css('box-shadow','0px 0px 10px '+$bg)
                $(this).css('borderRadius','20px')
            })
            $('a').mouseleave(function(){
                $(this).css('box-shadow','none')
                $(this).css('borderRadius','50px')
            })
             
         })
     </script>
</head>
<body>
    <a href="#">1</a>
    <a href="#">2</a>
    <a href="#">3</a>
    <a href="#">4</a>
    <button>随机</button>
</body>
</html>


发布手记

热门词条