Can you access a HTML form data from the event property, or a "this" keyword, in javascript?

Question

I know that you can easily get data from a form like:

function getData(event) {
        event.preventDefault();
      const inpt = document.getElementById("inpt").value;
        return inpt;
}

//OR

function getData(event) {
        event.preventDefault();
      const inpt = document.getElementById('form').elements[0].value;
        return inpt;
}

<form id="form" onsubmit="getData(event)">
      <input id="inpt" type="text"></input>
</form>

what I'd like to know is if this same value could be reached through the event property or a this keyword, withou using a "getElementBy..." of any sort or any querySelector.

Answer 1

Since the event listener is set on the form, the form element is available as

event.target

And so the text field value would be accessible by

event.target.elements[0].value

The form element is also this within the submit handler, so you could also do

this.elements[0].value.