摘要:<!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>
批改老师:灭绝师太批改时间:2019-01-16 13:43:46
老师总结:完成的很好呦,js代码还可以简化,空余时间可以尝试!加油!