Javascript EventListener вызван собственным

Question

У меня есть часть кода, которая должна менять цвет текста всякий раз, когда пользователь нажимает на текст. Но цвет текста изменяется до того, как пользователь нажимает на текст. Кажется, что событие click вызвано, прежде чем пользователь сделает это !!! Пожалуйста, скажите мне, что я делаю неправильно здесь?

var div = document.getElementById("div1"); // there is html div inside of html file with id "div1" 
div.innerHTML = "Hello world"; 

function colorChange(id){ 
    document.getElementById(id).style.color="red"; 

}; 

div.addEventListener("click",colorChange("div1")); 

Answer 1

Вы на самом деле вызова функция, как только вы создаете свой обработчик событий. Обратите внимание на свой код div.addEventListener('click', colorChange('div1')) < - это факт, что у вас есть () paranthesis (который вызывает функцию).

Вместо этого вам необходимо передать анонимную функцию.

div.addEventListener("click", function() { 
    colorChange("div1") 
});