摘要:<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>获取随机色</title> <script type="text/javascript" src="jquery.js"></script> <style type="text/css"> a { float:left; display:block; margin:50px; width:200px; line-height: 100px; text-align: center; height:200px; color:#fff; border-radius: 50px; text-decoration: none; } </style> <script type="text/javascript"> //改变标签的背景颜色 function aa(tag) { var len=document.getElementsByTagName(tag).length for(var 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)+')' } } $(document).ready(function(){ aa('a') $("#flashcolor").click(function(){ //alert("h1"); aa('a') $bg=$('a').css('backgroundColor') $('a').css('box-shadow','0px 0px 20px '+$bg) $('a').text($bg); //$('a').css('border-radius','20px ') }) $('a').mouseover(function(){ $bg=$(this).css('backgroundColor') $(this).css('box-shadow','0px 0px 20px '+$bg) $(this).css('border-radius','20px ') }) $('a').mouseleave(function(){ $(this).css('box-shadow','none') $(this).css('border-radius','50px ') }) }) </script> </head> <body> <a href="#">1</a> <a href="#">2</a> <a href="#">3</a> <a href="#">4</a> <div> <button id="flashcolor">刷新颜色</button> </div> </body> </html>
批改老师:天蓬老师批改时间:2019-01-11 22:40:55
老师总结:document.getElementsByTagName(tag)[i], 可以试一下这种语法: document.getElementsByTagName(tag).item(i), 也很好用