JS HTML Events
Input and change events happen at different times for some controls. Choose the event that matches the feedback needed.
Where to run this
This example changes a document. Open it in the HTML playground, then select Run code. It runs inside a separate preview.
A practical example
<label for="topic">Topic</label>
<input id="topic">
<p id="length"></p>
<script>
document.getElementById("topic").addEventListener("input", event => {
document.getElementById("length").textContent = event.target.value.length + " code units";
});
</script>
What happens
The count updates during editing.