this
✨ Jabont
<html> <head> <title>Let's Start </title> <style> body{ margin:2em; } .heart{ background:deeppink; width:2em; height:2em; margin:.2em; float:left; } .heart[data-like="-1"]{ background:#aaa; } </style> </head> <body> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <div class="heart" data-like="-1" onclick="rong(this)"> </div> <script> function rong(el){ let h = document.querySelectorAll('.heart') for(i=0 ; i<h.length ; i++){ h[i].dataset.like = '-1'; } el.dataset.like *= -1 } </script> </body> </html>