摘要：<!DOCTYPE html><html><head><meta charset="UTF-8"><title>随机色</title><script type="text/javascript" src="jquery-3.3.1.min.js"><
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>随机色</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<style type="text/css">
ul,li{list-style: none}
ul{width:1000px;margin: 100px auto;}
li{width: 150px;float: left;}
a{display: block;width:100px;height: 100px;font-weight: bold;font-size: 18px;border-radius: 50px;line-height: 100px;text-align: center;}
</style>
</head>
<body>
<ul>
<li><a>1</a></li>
<li><a>2</a></li>
<li><a>3</a></li>
<li><a>4</a></li>
<li><a>5</a></li>
</ul>
</body>
<script type="text/javascript">
function bgc(tagName){
var name = document.getElementsByTagName(tagName);
for (var i = name.length - 1; i >= 0; i--) {
name[i].style.backgroundColor = 'rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')'
}
}
$(document).ready(function(){
bgc('a');
$('a').mouseover(function(){
$(this).css('border-radius','20px')
})
$('a').click(function(){
$(this).css('backgroundColor','rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')')
// $(this).style.backgroundColor = 'rgb('+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+')'
})
$('a').mouseleave(function(event) {
$(this).css('border-radius','50px')
});
})
</script>
</html>
批改老师：灭绝师太批改时间：2019-03-18 17:07:25
老师总结：完成的不错,但是完成作业的时候要看清题目啊!点击效果呢~
