Почему моя кнопка не вызывает функцию снова?

Question

Я пытался создать кнопку для повторного вызова функции, чтобы отобразить новый абзац HTML, но по какой-то причине это не сработало.

Я пытался вызвать вызов функциикнопка в моем файле JS, но кнопка ничего не меняет, когда я нажимаю на нее.Все остается неизменным.

Это ближе к концу HTML, где я создал кнопку:

<p>&#8220;We labour at our daily work more ardently and thoughtlessly than is necessary to sustain our life because it is even more necessary not to have leisure to stop and think. Haste is universal because everyone is in flight from himself.&#8221;</p>
<p>&#8220;One should die proudly when it is no longer possible to live proudly.&#8221;</p>
    </div>
    <button class="button">Thus Spoke Nietzsche</button>
<script src="randomize.js"></script>
</body>

И это JS:

"use strict";
const quotes = document.querySelectorAll("p");

const randomize = function() {
    let num = (Math.floor(Math.random() * Math.floor(quotes.length)) - 1);
    let quote = quotes.item(num).innerHTML;
  return quote;
}
const run = function(){
  let randomQuote = randomize();
  let passage = document.getElementById('quotes');
  passage.innerHTML = randomQuote;
  return console.log(randomQuote);
}
const newQuote = document.querySelector('.button');
newQuote.addEventListener('click', run());

Спасибо за помощь.

Answer 1

Так что, по крайней мере, часть проблемы заключается в следующем:

newQuote.addEventListener('click', run());

Что должно быть просто:

newQuote.addEventListener('click', run);

addEventListener ожидает, что второй аргумент, который вы дадите, будет функцией. Это будет функция, выполняемая при нажатии newQuote . Но когда вы говорите run () (с круглыми скобками), вы на самом деле вызываете функцию run и передаете результат addEventListener , который в этом случае будет не определено .

Могут быть и другие проблемы, но у меня не было времени, чтобы на самом деле создать кодовую ручку и тщательно ее изучить, но это было первое, что выделилось мне.