Функция по событию выполняется сразу при старте

Question

Вот просто левый пример. Почему функция, которая должна выполняться по клику, выполняется просто так?

button = document.getElementsByClassName("button")[0];
block = document.getElementsByClassName("block")[0];
button.onclick = test();
function test(){
block.style.height = "100px";

block.style.background = "red";
}

Answer 1

Потому что вы присваиваете onclick не функцию, а результат ее выполнения.

Правильно будет:

function test(){
  block.style.height = "100px";  
  block.style.background = "red";
}
button.onclick = test;//без скобок

или

button.onclick = function(){
  block.style.height = "100px";  
  block.style.background = "red";
}