Change-tapahtuma JavaScriptissä

Tällä oppitunnilla tutkimme yhdessä change-tapahtuman, joka syntyy syöttökentissä niiden muuttuessa. Mitä tämä tarkoittaa? Oletetaan, että sinulla on syöttökenttä ja siinä on jokin teksti. Jos muutat tätä tekstiä, niin tässä tapauksessa tämä tapahtuma syntyy.

Katsotaanpa esimerkkiä. Olkoon meillä syöttökenttä:

html<input id="elem" value="text">

Laittakaamme sen muuttuessa tulostamaan konsoliin sen uuden arvon:

javascriptlet elem = document.querySelector('#elem');

elem.addEventListener('change', function() {
  console.log(this.value);
});