javascript - 如何仅使用 JS(不是 jquery)更改 div 的颜色，而没有 ID 或单击元素？

Question

因此，当我单击 c1 时，我希望它变黑(只有 c1)，再次单击时变回红色。 c2 和 c3 相同。所以我想在没有 ID 并且不在元素上放置 onclick""的情况下执行此操作。哦，我忘了提到没有 jQuery :] 我知道这与使用 select 有关。这纯粹是为了学习/尝试目的。

http://jsfiddle.net/hy58knvc/

???

Answer 1

是的:

var circles= document.querySelectorAll('.circle');

for(var i = 0 ; i < circles.length ; i++) {
  circles[i].onclick= function(){
    this.style.backgroundColor= this.style.backgroundColor === 'black' ? 'red' : 'black';
  }
}

第一行查询 circle 类的所有元素。

然后它为每个分配一个 onclick 处理程序，这会切换背景颜色。

Fiddle