Input

Javascript kan op verschillende manieren input ontvangen:

Javascript gebuikt events om te reageren op HTML knoppen. Meer hierover kun je lezen in het hoofdstuk "Javascript-Events".

HTML input velden

Naast knoppen kun je ook de inhoud van HTML input velden uitlezen en verwerken. Om toegang te krijgen tot een HTML-element, gebruiken we weer de document.getElementById(id) methode.

Het id-attribuut definieert het HTML-element. De value-eigenschap definieert de HTML-inhoud:
Hieronder een voorbeeld om te testen:

<!DOCTYPE html>
<html>
 <head>
   <title>JavaScript</title>
   <meta charset="utf-8">
 </head>
 <body>
   <h1>Demo</h1>
    <input type="text" name="demo1" id="demo1" value="hello"> <br>
    <input type="checkbox" name="demo2" id="demo2" checked>  <br>
    <input type="date" name="demo3" id="demo3" value="2020-11-05">  <br>
    <br>
    <br>
    <script>
     var data = document.getElementById("demo1").value;
      document.write(data+"<br>");
      data = document.getElementById("demo2").checked;
      document.write(data+"<br>");
      data = document.getElementById("demo3").value;
      document.write(data+"<br>");
   </script>
 </body>
</html>

Meer HTML input elementen kun je vinden op de volgende pagina: https://www.w3schools.com/html/html_form_input_types.asp

Het vullen van HTML input elementen met een waarde gaat als volgt:

voorbeeld:

document.getElementById("demo1").value = "hello";
document.getElementById("demo2").checked = false;
document.getElementById("demo3").value = "2020-11-05";

Popup venster

Naast input velden is het ook mogelijk om input te vragen via een popup. Deze methode wordt niet vaak gebruikt aangezien dit vaak niet als gebruikersvriendelijk wordt ervaren.

voorbeeld:

var name = window.prompt("Enter your name: ");