js实现点击一行变色效果 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			ul{
				margin: 0;
				padding: 0;
			}
			li{
				list-style: none;
				height: 30px;
				border: 1px solid #333;
				margin-top: 10px;
			}
		</style>
		<script type="text/javascript">
			window.onload = function(){
				var aLi = document.getElementsByTagName('li');
				// console.log(aLi);
				for(var i = 0;i < aLi.length; i++){
					aLi[i].index = true;
					aLi[i].onclick = function(){
						if(this.index){
							this.style.background = 'red';
							this.index = false;
						}else{
							this.style.background = '#fff';
							this.index = true;
						}
						
					}
				}
			}
		</script>
	</head>
	<body>
		<ul>
			<li></li>
			<li></li>
			<li></li>
			<li></li>
			<li></li>
		</ul>
	</body>
</html>

 

posted @ 2022-08-19 00:08  JackieDYH  阅读(36)  评论(0)  编辑  收藏  举报  来源