runarberg 3 days ago

Unlike <div> and <span>, <output> becomes part of the form and you can target it as a named form item, e.g.

    <form id="my-form">
      <input name="number" type="number">
      <output name="result"></output>
    </form>

    <script>
      const myForm = document.getElementById("my-form");
      const inputField = document.elements.namedItem("number");
      const outputField = document.elements.namedItem("result");

      outputField.textContent = inputField.valueAsNumber ** 2;
    </script>
Reply View 1 reply
  • runarberg 2 days ago

    Too late to edit, but there is a mistake s/document.elements/myForm.elements/r :

        -   const inputField = document.elements.namedItem("number");
    -   const outputField = document.elements.namedItem("result");
    +   const inputField = myForm.elements.namedItem("number");
    +   const outputField = myform.elements.namedItem("result");
    Reply View 0 replies
c-smile 3 days ago

"better" in what sense? If in hypothetical semantic meaning then another old zombie <var> is better in that sense, isn't it?

Reply View 1 reply
  • samhh 2 days ago

    Those semantics make it more accessible for free.

    Reply View 0 replies