onclick事件——更改li标签背景图片

96 阅读 0 评论 64 点赞

我是靠谱客的博主安静身影，这篇文章主要介绍onclick事件——更改li标签背景图片，现在分享给大家，希望可以做个参考。

 1 <html>
 2
<head>
 3
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 4
<title>无标题</title>
 5
<style type="text/css">
 6 
ul li{
 7 
background: grey;
 8 
margin-bottom: 1px;
 9 
list-style: none;
10
}
11
</style>
12
<script type="text/javascript">
13
function change(obj){
14
var arr = document.getElementById("ul").getElementsByTagName("li");
15
for (var i = 0; i < arr.length; i++) {
16
var a = arr[i];
17 
a.style.background = "grey";
18 
};
19 
obj.style.background = "red";
20 
}
21
</script>
22
</head>
23
<body>
24
<ul id="ul">
25
<li onclick="change(this);">1</li>
26
<li onclick="change(this);">1</li>
27
<li onclick="change(this);">1</li>
28
<li onclick="change(this);">1</li>
29
<li onclick="change(this);">1</li>
30
<li onclick="change(this);">1</li>
31
<li onclick="change(this);">1</li>
32
<li onclick="change(this);">1</li>
33
</ul>
34
</body>
35 </html>