javascript - 等价于 JQuery 的纯 JavaScript $(this)

Question

我在下面给出一个简单的 jQuery 代码示例:

$(".black").on("click", function() {
    $(this).css("color", "red");
});

单击具有“黑色”CSS 类的元素时，特定元素的(此)颜色变为红色。

现在，如何用纯 JavaScript 编写上面的代码？当它用于类选择器时，请告诉我 Jquery $(this) 的 JavaScript 等价物。

Answer 1

var blacks = document.getElementsByClassName('black');

for(var i =0; i< blacks.length; i++){
    blacks[i].onclick = function(){ 
        this.style.color = 'red';
    }
}

  var blacks = document.getElementsByClassName('black');
    
    for(var i =0; i< blacks.length; i++){
        blacks[i].onclick = function(){ 
            this.style.color = 'red';
        }
    }

<div class="black">test</div>
<div class="black">test</div>
<div class="black">test</div>