Как превратить входные данные в прослушиватели событий

Question

Я просто хочу превратить приведенный ниже код JavaScript в прослушиватели событий:

function plot() {
  var f = document.querySelector("#function").value;
  var color = document.querySelector("#color").value;
  var derivative = document.querySelector("#der").value;

  parameters.data[0].fn = f;
  parameters.data[0].color = color;
  parameters.data[0].derivative.fn = derivative;

  functionPlot(parameters);
}

Чтобы уточнить, запросы: #der, #color, #function являются вводом html, и я хочуиспользуйте addEventListener вместо .value.

спасибо

Answer 1

Итерация по каждому селектору, добавление слушателя change к каждому элементу, где plot слушатель:

['function', 'color', 'der'].forEach((id) => {
  document.getElementById(id).addEventListener('change', plot);
});

function plot() {
  var f = document.querySelector("#function").value;
  var color = document.querySelector("#color").value;
  var derivative = document.querySelector("#der").value;

  parameters.data[0].fn = f;
  parameters.data[0].color = color;
  parameters.data[0].derivative.fn = derivative;

  functionPlot(parameters);
}