事件和样式互不干扰
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="./js/plugins/jquery.min.js"></script>
<style>
.dianji> div {
background-color: #fff ;
height: 60px;
display: inline-block;
line-height: 60px;
padding: 0 30px;
}
</style>
</head>
<body>
<div class="dianji">
<div id="1" onclick="dianjimetods(id)">1</div>
<div id="2" onclick="dianjimetods(id)">2</div>
<div id="3" onclick="dianjimetods(id)">3</div>
<div id="4" onclick="dianjimetods(id)">4</div>
</div>
<script>
var bts = document.querySelectorAll('.dianji>div')
console.log(bts)
function dianjimetods(id){
console.log(id)
for( var i =0 ;i<bts.length;i++){
bts[i].style.backgroundColor='';
}
$('#'+id).css('background-color','red')
}
</script>
</body>
</html>
版权声明：本文为qq_46063760原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。